C# と VB.NET の質問掲示板

2024/10/16(Wed) 12:24:43 編集(投稿者)

<pre><pre>視覚効果を試す前に、表示確認として
                    <Frame>
                        <VerticalStackLayout>
                            <Border>
                                <HorizontalStackLayout>
                                    <Label Text="Switch1" VerticalOptions="Center" />
                                    <Switch  OnColor="Green" ThumbColor="Cyan" IsToggled="False" />
                                </HorizontalStackLayout>
                            </Border>
                            <Border>
                                <HorizontalStackLayout>
                                    <Label Text="Switch2" VerticalOptions="Center" />
                                    <Switch OnColor="Green" ThumbColor="Red"  IsToggled="False"  />
                                </HorizontalStackLayout>
                            </Border>
                        </VerticalStackLayout>
                    </Frame>
と定義しました。
デバッグ実行、デバッグなし実行した際
Swichコントロールの右横に"Off" "on"といった表記があり。
コントロールを操作するとOnColor="Green" ThumbColor="Red"部分が無効化され、定義の状態に二度ともどりません。
症状を回避する方法などご存じの方、おられましたらご教示いただければ幸いです。

＜＜解決したい事項＞＞
１）Switchコントロールの右横に"Off" "on"といった表記をなくしたい。
２）Switchコントロールを操作してもOnColor="Green" ThumbColor="Red"部分が無効化されないようにしたい。


環境
Windows 11 Pro 24h2
Visual Studio 2022 Community 17.11
ターゲット.NETランタイム：.net8.0

追記）デバッグおよびデバッグなし実行はWindows Machineのみです。
追記２）動作時のスクショ（該当箇所のみ）
https://photos.app.goo.gl/BMJFG6uGb9xSB1hi8
</pre></pre>

■No103366 (よもやま(よもぎ工房) さん) に返信
> 2024/10/16(Wed) 13:19:41 編集(投稿者)
> ２）Switchコントロールを操作してもOnColor="Green" ThumbColor="Red"部分が無効化されないようにしたい。
VisualStateを用いた試験的定義を参考までに記載しておきます。　試験の都合上、ThumbColorやOnColor部分が明示的かつ固定的になっております。
        <Style TargetType="Switch" x:Key="testSwitchStyle">
            <Setter Property="VisualStateManager.VisualStateGroups">
                <Setter.Value>
                    <VisualStateGroupList>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="On">
                                <VisualState.Setters>
                                    <Setter Property="ThumbColor" Value="Orange" />
                                    <Setter Property="OnColor" Value="Green" />
                                    
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="Off">
                                <VisualState.Setters>
                                    <Setter Property="ThumbColor"  Value="Orange" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateGroupList>
                </Setter.Value>
            </Setter>
        </Style>

■No103402 (よもやま(よもぎ工房) さん) に返信
MAUIアプリ新規作成時、Resources/Stylesに"Styles.xaml"があり、
Switchコントロールを対象にしたスタイル設定が定義されています。
    <Style TargetType="Switch">
        <Setter Property="OnColor" Value="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource White}}" />
        <Setter Property="ThumbColor" Value="{StaticResource White}" />
        <Setter Property="VisualStateManager.VisualStateGroups">
            <VisualStateGroupList>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="Disabled">
                        <VisualState.Setters>
                            <Setter Property="OnColor" Value="{AppThemeBinding Light={StaticResource Gray300}, Dark={StaticResource Gray600}}" />
                            <Setter Property="ThumbColor" Value="{AppThemeBinding Light={StaticResource Gray300}, Dark={StaticResource Gray600}}" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="On">
                        <VisualState.Setters>
                            <Setter Property="OnColor" Value="{AppThemeBinding Light={StaticResource Secondary}, Dark={StaticResource Gray200}}" />
                            <Setter Property="ThumbColor" Value="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource White}}" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="Off">
                        <VisualState.Setters>
                            <Setter Property="ThumbColor" Value="{AppThemeBinding Light={StaticResource Gray400}, Dark={StaticResource Gray500}}" />
                        </VisualState.Setters>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateGroupList>
        </Setter>
    </Style>
〜〜〜
（個人的ぼやき）デフォルトの挙動や色設定としての定義なのはわからなくはないですが。"Styles.xaml"ファイルなんぞ記憶のすみっこにおいやってしまっていた。。