programing

이미지 변경을 위한 열거형 데이터트리거

telecom 2023. 4. 10. 20:57
반응형

이미지 변경을 위한 열거형 데이터트리거

배경 이미지가 고정된 버튼이 있는데 그 위에 작은 오버레이 이미지를 보여주고 싶습니다.선택하는 오버레이 이미지는 의존속성에 따라 달라집니다( ).LapCounterPingStatus)를 참조해 주세요.

지금까지 알아낸 건 다음과 같습니다.

<Button>
    <Grid>
        <Image Stretch="None"> <!-- Background Image -->
            <Image.Style>
                <Style TargetType="{x:Type Image}">
                    <Setter Property="Source" Value="/Images/Pingn.png"/>
                </Style>
            </Image.Style>
        </Image>
        <Image Stretch="None" Panel.ZIndex="1"> <!-- Small Overlay Image -->
            <Image.Style>
                <Style TargetType="{x:Type Image}">
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding Path=LapCounterPingStatus}" Value="PingStatus.PING_UNKNOWN">
                            <Setter Property="Source" Value="/Images/RefreshOverlayn.png"/>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding Path=LapCounterPingStatus}" Value="PingStatus.PING_FAILURE">
                            <Setter Property="Source" Value="/Images/ErrorOverlayn.png"/>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding Path=LapCounterPingStatus}" Value="PingStatus.PING_SUCCESS">
                            <Setter Property="Source" Value="/Images/CheckmarkOverlayn.png"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Image.Style>
        </Image>
    </Grid>
</Button>

뷰 모델의 관련 부분

public class ConfigurationViewModel
{
    public enum PingStatus { PING_UNKNOWN, PING_SUCCESS, PING_FAILURE };

    public PingStatus LapCounterPingStatus
    {
        get { return _lapCounterPingStatus; }
        set
        {
            _lapCounterPingStatus = value;
            RaisePropertyChanged(LapCounterPingStatusPropertyName);
        }
    }
}

지금은 오버레이 영상이 전혀 표시되지 않습니다.뭐가 잘못됐나요?


갱신하다

IDE 트레이스 창이 표시됨System.ArgumentException그리고.System.FormatException문제의 원인이 알 수 없는 유형의 열거일 수 있습니다.PingStatusXAML?

이 작업을 수행하려면 다음 두 가지가 필요합니다.

1 - 추가xmlnsXAML 파일의 루트 요소에서 Enum이 정의되어 있는 네임스페이스에 대한 참조:

<UserControl ...
xmlns:my="clr-namespace:YourEnumNamespace;assembly=YourAssembly"> 

2 - in theValue의 특성DataTrigger, 를 사용합니다.{x:Static}폼:

 <DataTrigger Binding="{Binding Path=LapCounterPingStatus}" Value="{x:Static my:PingStatus.PING_UNKNOWN}">

Enum 타입에는 위에서 정의한xmlns 프리픽스가 붙어야 합니다.

편집:

Enum이 클래스 내에서 선언된 경우 다음 구문을 사용해야 합니다.

{x:Static namespace:ClassName+EnumName.EnumValue}

예를 들어 다음과 같습니다.

{x:Static my:ConfigurationViewModel+PingStatus.PING_UNKNOWN}

WPF + MVVM의 완전한 작업 예.

MSVC 2017에서 테스트 완료.

보기:

<TextBlock Text="Some text to be colored by an enum">
    <TextBlock.Style>
        <Style TargetType="{x:Type TextBlock}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding StatusIcon}" Value="{x:Static my:StatusIcon.Warning}">
                    <Setter Property="Foreground" Value="Yellow"/>
                </DataTrigger>
                <DataTrigger Binding="{Binding StatusIcon}" Value="{x:Static my:StatusIcon.Error}">
                    <Setter Property="Foreground" Value="Red}"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </TextBlock.Style>
</TextBlock>

ReSharper를 사용하고 DataContext가 올바르게 설정되어 있는 경우,.끝나고StatusIcon예를 들어, 다음과 같은 열거형 속성을 표시합니다.Debug,Info,Warning또는Error.

ReSharper 를 사용하고 있는 경우는, XAML 파일의 헤더내의 네임스페이스에 다음의 갱신을 제안합니다(이렇게 됩니다).

xmlns:my="clr-namespace:Class.Path.MyViewModel;assembly=MyAssembly"

그리고 Vie Model:

public enum StatusIcon
{
    Debug,
    Info,
    Warning,
    Error
}

public class MyViewModel
{
    public StatusIcon StatusIcon { get; }
}

또,Fody자동 바인딩을 실현합니다.

열거 값을 DataTrigger 값으로 설정할 수 있습니다...MSVC 2017에서 테스트 완료.

<TextBlock Text="Some text to be colored by an enum">
    <TextBlock.Style>
        <Style TargetType="{x:Type TextBlock}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding StatusIcon}" Value="Warning">
                    <Setter Property="Foreground" Value="Yellow"/>
                </DataTrigger>
                <DataTrigger Binding="{Binding StatusIcon}" Value="Error">
                    <Setter Property="Foreground" Value="Red}"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </TextBlock.Style>
</TextBlock>

언급URL : https://stackoverflow.com/questions/13917033/datatrigger-on-enum-to-change-image

반응형