C#•2y ago

✅ Conditionally rendering the text and style of a label avalonia

<UserControl>
  <UserControl.Styles>
    <Style Selector="Label"></Style>
    <Style Selector="Label.Success"></Style>
    <Style Selector="Label.Error"></Style>
  </UserControl.Styles>

  <Border>
    <Grid>
      <Grid>
        <Label />
      </Grid>
    </Grid>
  </Border>
</UserControl>

<UserControl>
  <UserControl.Styles>
    <Style Selector="Label"></Style>
    <Style Selector="Label.Success"></Style>
    <Style Selector="Label.Error"></Style>
  </UserControl.Styles>

  <Border>
    <Grid>
      <Grid>
        <Label />
      </Grid>
    </Grid>
  </Border>
</UserControl>

public class LoginViewModel : ViewModelBase
{
    private bool _isSuccess;

    public LoginViewModel() {}

    public bool IsSuccess
    {
        get => _isSuccess;
        set => this.RaiseAndSetIfChanged(ref _isSuccess, value);
    }
}

public class LoginViewModel : ViewModelBase
{
    private bool _isSuccess;

    public LoginViewModel() {}

    public bool IsSuccess
    {
        get => _isSuccess;
        set => this.RaiseAndSetIfChanged(ref _isSuccess, value);
    }
}

I have a label that has text that is worked with in the view model. The text that it dislpays is based off the actions of the user. I want to set this label up to where the view model displays the correct message and correct styles based off a boolean value.

hugeman•2/25/24, 12:07 AM

Create a value converter than converts bool to Visibility

hugeman•2/25/24, 12:08 AM

One for true=visible,false=collapsed, and another for false=visible,true=collapsed

Hhugeman One for true=visible,false=collapsed, and another for false=visible,true=collaps...

MekOP•2/25/24, 12:33 AM

ok here's where I'm at so far. I did the label like so now if the user enters an invalid username, I want the label to show, the program to sleep for 2 seconds, then clear the texbox where the user typed in the invalid username.

hugeman•2/25/24, 12:34 AM

Ah didn't know avalonia had an IsVisible property

MekOP•2/25/24, 12:35 AM

it does

MekOP•2/25/24, 12:35 AM

how would I get access to the text box to clear the text?

hugeman•2/25/24, 12:36 AM

You could bind the text box's text in your view model

MekOP•2/25/24, 12:38 AM

I have that. It's bound to the variables Username and Password. I just don't know how to make the program sleep without freezing the program

hugeman•2/25/24, 12:40 AM

What do you need it to sleep for?

MekOP•2/25/24, 12:43 AM

it's like a make shift error thing. So really what's supposed to happen is that if the user enters invalid credentials, the system errors. It changes the view state of the error label so that the string shows and the TextBox styles change from a normal state to a yellow background. After 2-3 seconds, the screen kind of does a "refresh" and it changes the styles of the TextBox's back to their normal state, clears the user's input, and allows the user to try again

hugeman•2/25/24, 12:44 AM

You could a Task + the dispatcher to do that

hugeman•2/25/24, 12:45 AM

Set the background to yellow, start a task (or thread) and await Task.Delay (or Thread.Sleep) for 3000 millis, then call the dispatcher's Invoke method, where you'd restore the background

MekOP•2/25/24, 12:45 AM

so there is a TextBox for the username, a MaskedTextBox for the password and a Label for the error text. When the user enter's their credentials, it runs a check. If any part of the check fails, then it changes the TextBox and MaskedTextBox to a yellow background and changes the IsVisible state so that it can be displayed. After 3 seconds, the program needs to clear the text and change the styles back to normal on the TextBox and the MaskedTextBox and then change the IsVisible state of the label again so that it's no longer displayed

hugeman•2/25/24, 12:46 AM

You can access the dispatcher via i think Application.Current.Dispatcher, at least for WPF you can, not sure about avalonia

MekOP•2/25/24, 12:47 AM

ok but my brain is running into a problem

hugeman•2/25/24, 12:47 AM

Sleeping is the command line way of things, in UI applications you use timers/background threads and then dispatch a completion callback onto the main thread

MekOP•2/25/24, 12:48 AM

ok so if I use then I'll need a cancellation token.

hugeman•2/25/24, 12:48 AM

MMek ok so if I use `await Task.Delay()` then I'll need a cancellation token.

hugeman•2/25/24, 12:49 AM

Eh not really unless you want to cancel the yellow thing feature?

MekOP•2/25/24, 12:49 AM

this is how my splash screen is done

Hhugeman Eh not really unless you want to cancel the yellow thing feature?

MekOP•2/25/24, 12:54 AM

well I thought maybe I could do a system that would

validate the username. If the username is not a valid input => error class
validate the password. If the password is not a valid input => error class
validate that the username exists in the database. if not => error class
validate that the password input matches the currently saved password in the database. If not => error class
validate that both username and password are not empty strings. If so => error class

Error Class: <- started by the Task.Delay

Has access to the TextBox, MaskedTextBox, Label Classes="Error" objects
Changes both TextBox and MaskedTextBox background colors to yellow.
runs for 3 seconds
changes both TextBox and MaskedTextBox background colors back to normal.
clears the user's inputs from both the TextBox and MaskedTextBox

hugeman•2/25/24, 12:55 AM

Yeah you can do that last section with the dispatcher code I sent, but you do those extra things as well as set the yellow background

hugeman•2/25/24, 12:55 AM

But I don't know how you're gonna do it entirely in view models though

hugeman•2/25/24, 12:55 AM

That's kinda where my MVVM knowledge comes to an end...

hugeman•2/25/24, 12:56 AM

If avalonia has a Behaviour system built in, you might be able to create one and do stuff, and somehow access the view model maybe?

MekOP•2/25/24, 12:57 AM

wait

MekOP•2/25/24, 1:00 AM

I have the background of all the items set through compiled bindings. In the view model I set those values from a json file that is loaded on run time.

so I can control it through that

Hhugeman ```cs textBox.Background = Brushes.Yellow; Task.Delay(3000).ContinueWith((task) ...

MekOP•2/25/24, 1:05 AM

and I'm getting the error

hugeman•2/25/24, 1:06 AM

Is it not Application.Current.Dispatcher?

hugeman•2/25/24, 1:07 AM

Or Dispatcher.Instance maybe

hugeman•2/25/24, 1:07 AM

I haven't used avalonia much

Hhugeman I haven't used avalonia much

MekOP•2/25/24, 1:11 AM

It's Dispatcher.UIThread.Invoke(() => {})

MekOP•2/25/24, 1:11 AM

just foudn that out

Hhugeman I haven't used avalonia much

MekOP•2/25/24, 1:22 AM

LoginViewModel: https://pastebin.com/btLF7T8K
LoginView.axaml: https://pastebin.com/nNCpck3P

Here's what I have and I currently am getting the error and I have zero idea why

hugeman•2/25/24, 1:23 AM

It takes a User parameter, so it can't create it reflectively

hugeman•2/25/24, 1:24 AM

Well there's no default constructor so it can't create it

MekOP•2/25/24, 1:32 AM

ok so then how should I write it?

MekOP•2/25/24, 1:32 AM

the only reason I ask how should I write it is because I have other projects where I've done simliar things in a near exact manor and they worked fine

hugeman•2/25/24, 1:35 AM

I'm not sure, I don't really use MVVM that much anymore

MekOP•2/25/24, 1:36 AM

ok no problem

MekOP•2/25/24, 1:42 AM

thanks for your help. I'm going to create a new thread for my 3 remaining errors.