How to set image content for a button for windows phone 7

Question

我正在尝试为按钮设置图像，我的图像中不包含文本，我想手动为该图像设置文本，我尝试通过这种方式将按钮包含图像的按钮内容，但是我不知道如何为按钮设置文本它，我正在为Windows Mobile 7在Visual Studio 2012中工作

Answer 1

<Button x:Name="ButtonName" Height="Auto" Width="Auto">
    <StackPanel>
          <Image Source=image.JPG" Stretch="Fill" Height="Auto" Width="Auto" />
          <TextBlock Text="picture Button" TextAlignment="Center" />
    </StackPanel>
</Button>

Thing is donot set the content property of the button. Also give appropriate size to the button otherwise image control will make it excessively big

Put your controls inside the stackpanel which can take many children instead of only one child as supported by button, and you can control the size more easily.

---

Based on the image you gave, here is my code. Also you should put that image link in your question

<Button  Content="Text" Height="Auto" Width="Auto" BorderThickness="0">
     <Button.Background>
          <LinearGradientBrush StartPoint="0 0" EndPoint="0 1">
               <LinearGradientBrush.GradientStops>
                   <GradientStopCollection>
                       <GradientStop Offset="0" Color="#FF03CCF0" />
                       <GradientStop Offset="1" Color="#FF0182C2" />
                   </GradientStopCollection>
               </LinearGradientBrush.GradientStops>
           </LinearGradientBrush>
      </Button.Background>
  </Button>

Change button size according to requirement. Also you may need to change the background for other visual states using VisualStateManager, but the result will be much cleaner. Also there is very dirty trick too. I am not posting code for it. use a canvas as content, set it's background and then insert a textblock inside. I don't know will this work, but I wont do it anyway. using VisualStateManager is recommended.

Answer 2

The cleanest way for an Image to act as a Button is to set the style property.

<Style x:Key="CustomButton" TargetType="Button">
    <Setter Property="Template" >
        <Setter.Value >
            <ControlTemplate>
                <Image Source="Images/Sample.jpg" />
            </ControlTemplate >
        </Setter.Value >
    </Setter >

Set this code in your page by defining a new block <Grid.Resources></Grid.Resources> or you could do it universally in the StandardStyles.xaml and when you're defining a new Button set the BasedOn property to the Key value that you've defined in the style.