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

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

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

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

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

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

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

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

37
expression-blend windows windows-phone-7

4 ответов

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

в blend выберите свою кнопку, нажмите пункт меню "объект"->"редактировать шаблон" - > " редактировать копию...- и создается новый шаблон. В окне состояния выберите нажатое визуальное состояние в группе визуальное состояние 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>
47

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

        private void HighlightButton(Button btnToHighlight)
        {

            SolidColorBrush sBrush = (SolidColorBrush)btnToHighlight.Background;


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

        }
1
<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>
0

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

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

<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 на все, что пожелаете. Теперь вы готовы.

0