dxmvvm:BooleanToVisibilityConverter and window.IsLoaded issue

[SAgiKPJH]

문제 원인

[SAgiKPJH]

문제 추측

• 위 Login 예제는 RJ CODE 기반으로 구성된 코드입니다.
  • 링크 : https://github.com/RJCodeAdvance/Login-In-WPF-MVVM-C-Sharp-and-SQL-Server
• 비교하면서 그 원인 분석합니다.

[SAgiKPJH]

문제 발견

<Window x:Class="Client.Presentation.UI.LoginView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        mc:Ignorable="d"
        d:DesignHeight="450"
        d:DesignWidth="800"
        xmlns:common="clr-namespace:Client.Presentation.Common.DI"
        xmlns:viewModels="clr-namespace:Client.Business;assembly=Client.Business"
        xmlns:dxmvvm="http://schemas.devexpress.com/winfx/2008/xaml/mvvm"
        DataContext="{common:DISource Type={x:Type viewModels:LoginViewModel}}">
    <Window.Resources>

        <!--<BooleanToVisibilityConverter x:Key="BooleanToVisibility" /> --> <!-- IsLoaded = false -->
        <dxmvvm:BooleanToVisibilityConverter x:Key="BooleanToVisibility" />        <!-- IsLoaded = true -->
    </Window.Resources>

    <Window.Visibility>
        <Binding Path="IsViewVisible"
                 Mode="OneWay"
                 Converter="{StaticResource BooleanToVisibility}" />
    </Window.Visibility>

    <Grid Background="White">
    </Grid>
</Window>

// LoginViewModel.cs
public class LoginViewModel : ViewModelBase
{
    public bool IsViewVisible
    {
        get { return GetProperty(() => IsViewVisible); }
        set { SetProperty(() => IsViewVisible, value); }
    }

    public LoginViewModel()
    {
    }
}

// App.xaml
protected override void OnStartup(StartupEventArgs e)
        {
            base.OnStartup(e);

            Services = ConfigureServices();

            DISource.Resolver = Resolve;

            var loginView = new LoginView();
            loginView.Show();
            loginView.IsVisibleChanged += (s, ev) =>
            {
                if (!loginView.IsVisible && loginView.IsLoaded) // in this point
                {
                    var mainView = new MainWindow();
                    mainView.Show();
                    loginView.Close();
                }
            };
        }

• Window를 Close 할 때, Visable이 False 되어 IsVisibleChanged 이벤트가 동작합니다.
• 이때
  • WPF에서 기본 제공되는 BooleanToVisibilityConverter를 사용하면 loginView.IsLoaded = false
  • dxmvvm:BooleanToVisibilityConverter를 사용하면 loginView.IsLoaded = true (🔴오류 발생🔴)
  • dxmvvm:BooleanToVisibilityConverter의 코드 내용과 동일한 Converter를 Local에 구현해 사용하면 loginView.IsLoaded = false 오류 미발생합니다.

문제 원인 추측

• 동일한 dxmvvm converter를 local에 구현 한 내용은 문제가 없음이 밝혀졌기에,
• DevExpress의 Converter 자체 내의 기능 문제라 판단합니다.
  • dxmvvm:BooleanToVisibilityConverter를 호출하는 과정에서 Window Loaded 이벤트와 관련된 기능이 있을 것으로 추측합니다.

[SAgiKPJH]

문제원인.pptx

[SAgiKPJH]

DevExpress Converter와 동일하게 구현한 결과

• Local 동일하게 구현하면 문제 미발생
• 하지만 Devexpress Converter 사용시 문제 발생

[SAgiKPJH]

DevExpress 질문

• 다음 DevExpresss Support에 질문을 남겼습니다.
• https://supportcenter.devexpress.com/ticket/details/t1215797/dxmvvm-booleantovisibilityconverter-and-window-isleaded
• 질문에 답변이 달리는대로 결과 공유하겠습니다.

[SAgiKPJH]

DevExpress 질문 내용

Hello I Have some ploblem

<Window x:Class="Client.Presentation.UI.LoginView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        mc:Ignorable="d"
        d:DesignHeight="450"
        d:DesignWidth="800"
        xmlns:common="clr-namespace:Client.Presentation.Common.DI"
        xmlns:viewModels="clr-namespace:Client.Business;assembly=Client.Business"
        xmlns:dxmvvm="http://schemas.devexpress.com/winfx/2008/xaml/mvvm"
        DataContext="{common:DISource Type={x:Type viewModels:LoginViewModel}}">
    <Window.Resources>

        <!--<BooleanToVisibilityConverter x:Key="BooleanToVisibility" /> --> <!-- IsLoaded = false -->
        <dxmvvm:BooleanToVisibilityConverter x:Key="BooleanToVisibility" />        <!-- IsLoaded = true -->
    </Window.Resources>

    <Window.Visibility>
        <Binding Path="IsViewVisible"
                 Mode="OneWay"
                 Converter="{StaticResource BooleanToVisibility}" />
    </Window.Visibility>

    <Grid Background="White">
    </Grid>
</Window>

// LoginViewModel.cs
public class LoginViewModel : ViewModelBase
{
    public bool IsViewVisible
    {
        get { return GetProperty(() => IsViewVisible); }
        set { SetProperty(() => IsViewVisible, value); }
    }

    public LoginViewModel()
    {
    }
}

// App.xaml
protected override void OnStartup(StartupEventArgs e)
        {
            base.OnStartup(e);

            Services = ConfigureServices();

            DISource.Resolver = Resolve;

            var loginView = new LoginView();
            loginView.Show();
            loginView.IsVisibleChanged += (s, ev) =>
            {
                if (!loginView.IsVisible && loginView.IsLoaded) // in this point
                {
                    var mainView = new MainWindow();
                    mainView.Show();
                    loginView.Close();
                }
            };
        }

When closing the window, the IsVisibleChanged event is triggered. Depending on whether you choose BooleanToVisibilityConverter or dxmvvm:BooleanToVisibilityConverter, the IsLoaded part in the cs code of App.xaml appears as either false or true. This prevents me from using dxmvvm:BooleanToVisibilityConverter.

I'm curious about the cause of this issue and a possible solution.

[SAgiKPJH]

코드 분석

            var loginView = new LoginView();
            loginView.Show();
            loginView.IsVisibleChanged += (s, ev) =>
            {
                if (!loginView.IsVisible && loginView.IsLoaded) // in this point
                {
                    var mainView = new MainWindow();
                    mainView.Show();
                    loginView.Close();
                }
            };

위 코드를 사용하는 이유

• ViewModel에서 Sinup에 성공할 시 Visiable = false 합니다.

• 이때, Visiable은 False가 되었으니, IsVisibleChanged 이벤트 동작합니다.

• 하지만 IsLoaded 값은 True 이기 때문에, MainView가 Show 됩니다.

• 일반적으로 창을 종료할 시 IsLoaded는 False됩니다.

• 결론적으로, SignUp 되었는지 안되었는지 구분하기 위해서 위 코드를 사용합니다.

• 또한 위 코드에서는 App.xaml에서 Signup에 따라 위 코드가 동작한 다는 사실을 알 수 없기에

• 옳바른 코드가 아니라 판단합니다.

[SAgiKPJH]

제안

• SignUp을 진행할 때를 구분하기 위한 로직입니다.
• Visiable이 아닌 다른 로직을 활용하는 것도 좋은 방법이라 생각합니다.
• Login 창을 DialogShow 진행한 다음, return 값을 받는 것을 제안합니다.

코드 제안

• 다음과 같이 Show()가 아닌 DialogShow()를 통해 종료될 때 까지 기다리고, return 값을 받는 것을 추천합니다.
• 이렇게 하여 singup 여부를 전달받는 것을 제안합니다.

          var loginView = new LoginView();
          loginView.ShowDialog();
          if (loginView.DialogResult == true)
          {
              var mainView = new MainWindow();
              mainView.Show();
              loginView.Close();
          }

          var loginView = new LoginView();
          loginView.ShowDialog();
          if (loginView.DialogResult == true && loginView.IsSignUp == true) // 또는 특정 변수 추가해서 관리
          {
              var mainView = new MainWindow();
              mainView.Show();
              loginView.Close();
          }

[SAgiKPJH]

추가 질문

추가 질문

I apologize for the inconvenience.

It seems that there is a problem when there is a Binding element inside the Grid. I accidentally omitted and deleted the XAML code.

If there is a Binding element as follows, there may be an issue with the use of dxmvvm:BooleanToVisibilityConverter.

I share the file and video with you.

<Window.DataContext>
        <common:LoginViewModel />
    </Window.DataContext>
    <Window.Resources>

        <!--<BooleanToVisibilityConverter x:Key="BooleanToVisibility" />--> <!-- IsLoaded = false -->
        <dxmvvm:BooleanToVisibilityConverter x:Key="BooleanToVisibility" /> <!-- IsLoaded = true -->
    </Window.Resources>

    <Window.Visibility>
        <Binding Path="IsViewVisible"
                 Mode="OneWay"
                 Converter="{StaticResource BooleanToVisibility}" />
    </Window.Visibility>

    <Grid Background="White">
        <TextBox Text="{Binding Id}" />
    </Grid>

public class LoginViewModel : ViewModelBase
{
    public string Id
    {
        get { return GetProperty(() => Id); }
        set { SetProperty(() => Id, value); }
    }

    public bool IsViewVisible
    {
        get { return GetProperty(() => IsViewVisible); }
        set { SetProperty(() => IsViewVisible, value); }
    }

    public LoginViewModel()
    {
    }
}

I'm curious about the cause of this problem and possible solutions.

[SAgiKPJH]

답변

Thank you for the clarification. I reproduced this issue and researched it.

I found that BooleanToVisibilityConverter itself does not cause the issue. When I copy its implementation to a sample project, the result is similar to the standard converter. It occurs due to extra code executed when DevExpress components are used, and you'll see the same behavior if you use, for example, SimpleButton from our suite. However, the most interesting thing is that it's very easy to reproduce this behavior without DevExpress at all - for this you need to subscribe to the Loaded event for a control within a window. Please take a look at the modified sample where I demonstrated this.

Further research shows that this happens due to the SubtreeHasLoadedChangeHandler property value check in the IsLoaded getter - this is the specificity we cannot control at the level of our components.

Since there is no connection between IsLoaded and IsVisible properties in a general case, I recommend you re-work your current solution to make it more reliable. For example:

Show LoginView as a modal window to make sure that MainWindow is created after LoginView is closed;

var loginView = new LoginView();
loginView.ShowDialog();
var mainView = new MainWindow();
mainView.Show();

Handle the Closing/Closed event for LoginView instead of IsVisibleChanged. Thanks

[SAgiKPJH]

답변 정리

• Login에 대한 로직 변경을 권했습니다.