Windows Phone 7 (WP7) Изменение цвета фона кнопки при нажатии

Это похоже на действительно, очень простую проблему, но я не могу понять это. Преступник, по-видимому, является стилем WP7 по умолчанию. Он меняет цвет фона на белый, когда нажимается кнопка, а затем возвращается к фону кнопки по умолчанию.

Проблема заключается в том, что я хочу изменить фон кнопки при нажатии кнопки. Я не могу найти никакого способа сделать это.

Я попытался установить фон в коде, но это ничего не делает. Я думаю, что он был перезаписан стилем по умолчанию.

Я попытался использовать поведение свойства Change в Blend, но имеет тот же результат.

Я попытался создать новое визуальное состояние для кнопки и установить это на клик, но это немного багги и имеет большие накладные расходы для количества кнопок, с которыми я имею дело. Кроме того, это не сработало.

Я могу установить фон других кнопок в событии клика, просто не нажав кнопку.

Это такой раздражающий блокпост! Я уверен, что это одна строка кода.:)

Ответы

Ответ 1

Что вам нужно сделать, это создать шаблон кнопки, который изменяет отображаемое визуальное состояние.

В режиме смешивания выберите свою кнопку, щелкните пункт меню "Объект" → "Редактировать шаблон" → "Редактировать копию..." и создайте новый шаблон. В окне "Штаты" выберите "Нажатое визуальное состояние" в визуальной группе состояний CommonStates. Теперь выберите ButtonBackground в иерархии объектов и отредактируйте кисть фона в окне свойств.

Я отредактировал фон "Прессованный", чтобы быть сплошным голубоватым цветом и в итоге появился что-то вроде этого XAML.

<phone:PhoneApplicationPage ...>
    <phone:PhoneApplicationPage.Resources>
        <Style x:Key="ButtonStyle1" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid Background="Transparent">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="MouseOver"/>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneBackgroundBrush}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ColorAnimation Duration="0" To="Cyan" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ButtonBackground" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="0" Margin="{StaticResource PhoneTouchTargetOverhang}" Background="Black">
                                <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </phone:PhoneApplicationPage.Resources>

    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Button Content="Button" Style="{StaticResource ButtonStyle1}"/>
    </Grid>
</phone:PhoneApplicationPage>

Ответ 2

Я думаю, что получить ссылку на фактический фон, а затем изменить это может помочь. Здесь метод, который примет экземпляр кнопки.

        private void HighlightButton(Button btnToHighlight)
        {

            SolidColorBrush sBrush = (SolidColorBrush)btnToHighlight.Background;


            sBrush.Color = //enter your colour here
            btnToHighlight.Background = sBrush;

        }

Ответ 3

<ControlTemplate x:Key="ButtonNextOver" TargetType="Button">
                <Grid>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00" Storyboard.TargetProperty="Background" Storyboard.TargetName="hoverbutton">
                                        <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                            <DiscreteObjectKeyFrame.Value>
                                                <ImageBrush ImageSource="/NhomMua;component/Image/ico_next_over.png"/>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="FocusStates">
                            <VisualState x:Name="Focused"/>
                            <VisualState x:Name="Unfocused"/>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Border x:Name="hoverbutton">
                        <Border.Background>
                            <ImageBrush ImageSource="/NhomMua;component/Image/ico_next.png"/>
                        </Border.Background>
                    </Border>
                </Grid>
            </ControlTemplate>

Ответ 4

Чтобы изменить фон кнопки при нажатии кнопки, я использую шаблоны. Как отметил Мэтт, откройте проект в Blend. Перейдите к кнопке > Щелкните правой кнопкой мыши > Изменить шаблон > Изменить копию. Новый шаблон для вашей кнопки будет создан и добавлен в ближайшем начале вашей страницы XAML.

Теперь, когда вам нужно изменить поведение кнопок при нажатии кнопки, вам необходимо изменить VisualState. Перейдите к визуальному состоянию "Pressed" и загляните в него. Это "прессованное" визуальное состояние.

<VisualState x:Name="Pressed">
 <Storyboard>
      <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer">
           <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneBackgroundBrush}"/>
      </ObjectAnimationUsingKeyFrames>
           <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground">
      <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/>
      </ObjectAnimationUsingKeyFrames>
      <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="BorderBrush">
           <DiscreteObjectKeyFrame KeyTime="0" Value="#FF373737" />
      </ObjectAnimationUsingKeyFrames>
 </Storyboard>

Измените значение # FF373737 на все, что вы пожелаете. Теперь вы настроены.