如何制作可点击的列表框?

时间:2014-03-22 16:27:17

标签: c# wpf listbox

我有一个绑定到列表框的用户列表(图像和用户的名称),我想渲染这个lisbox可点击,所以当我点击用户的图像时,我将被重定向 他的帐户。 这是显示用户的用户控件:

    <UserControl x:Class="Navigateur.Presentation.UserControlWork.ListeEnfControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:conv="clr-namespace:Navigateur.Presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" Height="Auto" Width="Auto"
             >
    <UserControl.Resources>
        <conv:ByteArrayToImageConverter x:Key="bytearraytoImageConverter" />
    </UserControl.Resources>
    <Grid >
        <ListBox x:Name="_imageList" Margin="10,10,10,0" IsSynchronizedWithCurrentItem="True" ScrollViewer.HorizontalScrollBarVisibility="Visible"  VerticalAlignment="Top" Height="250" BorderThickness="0" MouseLeftButtonDown="Click_Kid" >
            <ListBox.ItemTemplate>
                <DataTemplate DataType="Enfant">
                    <Border CornerRadius="30">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition/>
                            <RowDefinition/>
                        </Grid.RowDefinitions>

                                <Image Grid.Row="0" x:Name="image" Source="{Binding avatar}" Width="50" Height="80"/>
                                <TextBlock Grid.Row="1" x:Name="nom" Text="{Binding prenom}" VerticalAlignment="Center"/>
                    </Grid>
                    </Border>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>
</UserControl>

1 个答案:

答案 0 :(得分:1)

使用Button代替Image并使用覆盖Button的模板为其提供图像外观,以便您可以使用可点击的图像。

<Button Grid.Row="0" Width="50" Height="80">
    <Button.Template>
        <ControlTemplate>
            <Image x:Name="image" Source="{Binding avatar}"/>
        </ControlTemplate>
    </Button.Template>
</Button>

如果您正在使用MVVM,则可以使用按钮绑定Command。如果想要在代码后面执行操作,则可以挂钩Click事件按钮以确定单击哪个图像。