Цвет фона для Radiobutton - PullRequest
       11

Цвет фона для Radiobutton

1 голос
/ 25 марта 2020

В MetroWindow я хочу создать три больших прямоугольных angular переключателя. При выборе переключателя следует изменить его цвет фона, чтобы пометить его как выбранный.

В настоящее время у меня примерно так:

MainWindow.xaml:

<ma:MetroWindow x:Class="WpfForm.MainWindow"
    xmlns:ma="http://metro.mahapps.com/winfx/xaml/controls"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfForm"
    mc:Ignorable="d"
    Title="MainWindow" Height="720" Width="1280" DataContext="{Binding RelativeSource={RelativeSource Self}}" WindowStartupLocation="CenterScreen" WindowStyle="ThreeDBorderWindow" Background="White" Loaded="MainWindow_Loaded" Closing="Window_Closing">
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="0.285*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <TabControl TabStripPlacement="Left" Width="Auto" Height="Auto" Grid.ColumnSpan="4" Margin="4,0,3,0"
                SelectedIndex="{Binding SelectedTab, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                SelectionChanged="MainWindowTabControl_SelectionChanged" >
        <TabItem >
            <TabItem.Header>
                <StackPanel>
                    <TextBlock Text="Aktion" FontSize="20" FontWeight="Bold" Padding="8" HorizontalAlignment="Center" />
                </StackPanel>
            </TabItem.Header>
            <Grid >
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <RadioButton Style="{DynamicResource SquareButtonStyle}" 
                             Grid.Column="0" 
                             IsChecked="{Binding isFirstButtonSelected, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" 
                             VerticalAlignment="Center"  
                             HorizontalAlignment="Center" 
                             Width="210" Height=" 320" 
                             Margin="0,0,0,170"  
                             BorderBrush="#FF707070" 
                             ma:ButtonHelper.CornerRadius="50" 
                             FontSize="28"
                             HorizontalContentAlignment="Center"
                             VerticalContentAlignment="Center" 
                             ma:ButtonHelper.PreserveTextCase="True"
                             Content="Text1">
                </RadioButton>
                <RadioButton Style="{DynamicResource SquareButtonStyle}" 
                             Grid.Column="1" 
                             IsChecked="{Binding isSecondButtonSelected, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" 
                             VerticalAlignment="Center"  
                             HorizontalAlignment="Center" 
                             Width="210" Height=" 320" 
                             Margin="0,0,0,170"  
                             BorderBrush="#FF707070" 
                             ma:ButtonHelper.CornerRadius="50"
                             FontSize="28"
                             HorizontalContentAlignment="Center"
                             VerticalContentAlignment="Center" 
                             ma:ButtonHelper.PreserveTextCase="True"
                             Content="Text2"/>
                <RadioButton Style="{DynamicResource SquareButtonStyle}" 
                             Grid.Column="2" 
                             IsChecked="{Binding isThirdButtonSelected, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" 
                             VerticalAlignment="Center"  
                             HorizontalAlignment="Center" 
                             Width="210" Height=" 320" 
                             Margin="0,0,0,170"  
                             BorderBrush="#FF707070" 
                             ma:ButtonHelper.CornerRadius="50"
                             FontSize="28"
                             HorizontalContentAlignment="Center"
                             VerticalContentAlignment="Center" 
                             ma:ButtonHelper.PreserveTextCase="True"
                             Content="Text3">
                </RadioButton>
                <Button VerticalAlignment="Bottom" HorizontalAlignment="Right" Padding="35,3"
                        Margin="0,0,8,6" Grid.Column="2" IsEnabled="{Binding ActionTabAllowNext, UpdateSourceTrigger=PropertyChanged}"
                        Command="{Binding ActionCommand}" Content="Next" FontSize="18" />
            </Grid>
        </TabItem>
    </TabControl>
</Grid>
</ma:MetroWindow>

App.xaml:

<Application x:Class="WpfForm.App"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:local="clr-namespace:WpfForm"
         StartupUri="MainWindow.xaml">
<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <!-- MahApps.Metro resource dictionaries. Make sure that all file names are Case Sensitive! -->
            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" />
            <!-- Accent and AppTheme setting -->
            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Crimson.xaml" />
            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>
</Application>

При нажатии на кнопку он меняет цвет только при зависании и нажатии мыши, но при отпускании мыши возвращается в нормальное состояние. Может быть, я могу добавить дополнительное свойство, чтобы пометить кнопки как выбранные?

Решение

Ответ ниже работал для меня. Спасибо за помощь. В конце я выбрал другой подход, который подходит лучше: я изменил стиль для RadioButtons на ToggleButton. Тем не менее ответ ниже является правильным.

1 Ответ

1 голос
/ 26 марта 2020

Вы можете найти определение стиля онлайн на github mahapp: https://github.com/MahApps/MahApps.Metro/blob/develop/src/MahApps.Metro/Styles/Controls.RadioButton.xaml

Просто скопируйте и вставьте его, например, в ваш App.xaml и измените значения цвета по мере того, как вы sh.

Не забудьте привязать стиль к вашей отредактированной версии везде, где вы используете RadioButton.

...