Как я могу остановить управление кнопками в Windows Phone от появления этой ужасной белой вспышки при нажатии?

Question

Итак, у меня есть несколько элементов в списке, которые я отображаю на главной странице. У меня есть кнопка, которая выглядит следующим образом:

<Button Grid.Column="1" Click="Button_Click" BorderThickness="0" Height="40">
     <Button.Background>
           <ImageBrush ImageSource="/WindowsPhonePanoramaApplication2;component/Images/appbar.feature.email.rest.png" Stretch="None" />
     </Button.Background>
</Button>

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

Спасибо за внимание

Answer 1

Вам нужно изменить шаблон кнопки. Вы можете найти шаблон в файле здесь:

C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.0\Design\System.Windows.xaml

Шаблон ButtonBase выглядит следующим образом:

  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="ButtonBase">
        <Grid Background="Transparent">
          <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates">
              <VisualState x:Name="Normal"/>
              <VisualState x:Name="MouseOver"/>
              <VisualState x:Name="Pressed">
                <Storyboard>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentContainer" Storyboard.TargetProperty="Foreground">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneBackgroundBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="Background">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="BorderBrush">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                </Storyboard>
              </VisualState>
              <VisualState x:Name="Disabled">
                <Storyboard>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentContainer" Storyboard.TargetProperty="Foreground">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="BorderBrush">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="Background">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent" />
                  </ObjectAnimationUsingKeyFrames>
                </Storyboard>
              </VisualState>
            </VisualStateGroup>
          </VisualStateManager.VisualStateGroups>
          <Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="0" Background="{TemplateBinding Background}" Margin="{StaticResource PhoneTouchTargetOverhang}" >
            <ContentControl x:Name="ContentContainer" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Padding="{TemplateBinding Padding}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
          </Border>
        </Grid>
      </ControlTemplate>
    </Setter.Value>
  </Setter>

Обратите внимание, как Pressed VisualState меняет фон элемента ButtonBackground (то есть Border) на PhoneForegroundBrush. Это то, что заставляет вашу кнопку стать белой.

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

Answer 2

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

См. Также следующие элементы управления / варианты кнопок изображения:
http://blogs.msdn.com/b/dohollan/archive/2011/04/22/using-images-as-buttons-on-windows-phone-7.aspx
http://www.silvergeek.net/windows-phone-7/imagebutton-control-for-win-phone-7/
http://blogs.msdn.com/b/priozersk/archive/2010/08/14/creating-round-image-button-for-wp7-part-1.aspx

Answer 3

Этому Вопросу год.Тем не менее, вот идеальный способ достичь того, что вы хотите.Я вижу, что вы хотите имитировать то же самое, что и при нажатии на значок панели приложения.

Набор инструментов Coding4fun содержит именно то, что вам нужно.

Вот как будет выглядеть код:

<c4fControls:RoundButton Grid.Column="1" Click="Button_Click" 
    ImageSource="/Myapp;component/Images/appbar.img.png"/>

Конечно, вы должны включить библиотеку coding4fun в свой проект.Добавьте эту строку в начало страницы.

xmlns:c4fControls="clr-namespace:Coding4Fun.Phone.Controls;assembly=Coding4Fun.Phone.Controls"