1

リスト ボックスのイメージは表示されますが、ボタンのイメージは表示されません。何か案は？DataTemplate を使用して画像をボタンにバインドするにはどうすればよいですか?

namespace wpftest
{
  /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
    string URL1 = "example.com/test.jpg";

    public MainWindow()
    {
        InitializeComponent();
        MyObj list = new MyObj(URL1);

        List<MyObj> _list = new List<MyObj>()
        {
           new MyObj{ url1 = "example.com/test.jpg"},
           new MyObj{ url1 = "example.com/test.jpg"},
           new MyObj{ url1 = "example.com/test.jpg"}
        };

        button1.DataContext = new MyObj { url1 = "example.com/test.jpg" };
        listBox1.DataContext = new CollectionViewSource { Source = _list };

    }
}
}

/////////////////////////////////////////////// ///////////////////////////////////

  <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:Res="clr-namespace:wpftest.Properties"
                    >

    <DataTemplate x:Key="myTemplate">
        <StackPanel Orientation="Horizontal">
            <Image Height="307" Name="image1" Stretch="None" Width="300" Source="{Binding url1}"/>
            <StackPanel>
                <TextBlock 
                    Text="{x:Static Res:Resources.Title}"/>
                <TextBlock Text="URL"/>
            </StackPanel>
        </StackPanel>
   </DataTemplate>

    <DataTemplate x:Key="customImageTileButton">
        <StackPanel Orientation="Horizontal">
            <Image Height="307" Name="image1" Stretch="None" Width="300" Source="{Binding url1}"/>

            <TextBlock Name="customTitle" Text="Title"/>
        </StackPanel>
    </DataTemplate>
</ResourceDictionary>

/////////////////////////////////////////////// ///

<Window x:Class="wpftest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="720" Width="1280"
    xmlns:Res="clr-namespace:wpftest.Properties" DataContext="{Binding}">

<Window.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="ResourceDictionary.xaml"/>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Window.Resources>


<Grid>
    <StackPanel Height="457" HorizontalAlignment="Left" Name="stackPanel1" VerticalAlignment="Top" Width="1258" >
        <ListBox Height="452" Name="listBox1" Width="1253" 
                 ItemTemplate="{StaticResource myTemplate}"
                 ItemsSource="{Binding}">         
        </ListBox>
    </StackPanel>

    <Button Content="Button" 
            ContentTemplate="{StaticResource customImageTileButton}"
            HorizontalAlignment="Left"
            Margin="84,492,0,0"
            Name="button1" 
            VerticalAlignment="Top" 
            />
</Grid>

4

3 に答える 3

0

これはうまくいったようです：

<Style x:Key="customStyle" TargetType="{x:Type Button}">
    <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
    <Setter Property="BorderThickness" Value="3"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Padding" Value="0,0,1,1"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Canvas x:Name="ButtonCanvas" Width="296" Height="121">
                    <Image x:Name="ButtonImage" Width="280" Height="105" Canvas.Left="8" Canvas.Top="8" Source="{Binding url1}"/>
                </Canvas>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsKeyboardFocused" Value="true"/>
                    <Trigger Property="IsDefaulted" Value="true"/>
                    <Trigger Property="IsPressed" Value="true"/>
                    <Trigger Property="ToggleButton.IsChecked" Value="true"/>
                    <Trigger Property="IsEnabled" Value="true">
                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

ベルとホイッスルのない短いバージョン ///////////////////////////////////////

 <Style x:Key="myButton" TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Image x:Name="ButtonImage" Width="280" Height="105" Canvas.Left="8" Canvas.Top="8" Source="{Binding url1}"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>   
    </Style
于 2012-06-18T21:38:55.957 に答える
0

ボタンの背景として ImageBrush を使用します。サンプルコードは以下です。

    <Window x:Class="ImageOnButton.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
<Window.Resources>
    <ImageSource x:Key="img">C:\Users\vanathi\Desktop\SampleImage.jpg</ImageSource>
</Window.Resources>
<Grid>
    <Button Width="250" Height="100">
        <Button.Background>
            <ImageBrush ImageSource="{StaticResource img}"/>
        </Button.Background>
    </Button>
</Grid>

于 2012-06-18T20:42:39.310 に答える
0

ボタンの前景に画像を直接バインドできます。

<Button Height="50" Width="50" Grid.Column="1">
    <Image Source="{DynamicResource ChooseImageSource}" />
</Button>

画像リソースは次のように定義されています。

<BitmapImage x:Key="ChooseImageSource" CacheOption="OnLoad"
             CreateOptions="IgnoreImageCache" UriSource="resources/shuffle.png"/>
于 2012-06-18T20:49:33.983 に答える