如何制作可点击的列表框? [英] How do i make a clickable listbox?

问题描述

我有一个绑定到列表框的用户列表(图像和用户名)，我想使此lisbox可单击，因此如果我单击用户的图像，将被重定向 到他的帐户. 这是显示用户的用户控件:

i have a list of users that are bound to a listbox(image and the name of the user) and i want to render this lisbox clickable so whnever i click on a user's image i will be redirected to his account. this is the user control that displays the users:

    <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>

推荐答案

使用Button代替Image并覆盖Button的模板以使其具有外观，，以便您获得可点击的图像.

Use Button in place of Image and override template of Button to give it an Image look, so that you can have clickable image.

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

如果使用的是MVVM，则可以将Command与按钮绑定，或者如果要在后面的代码中执行操作，则可以挂接Button的Click事件以确定要单击的图像.

If you are using MVVM, you can bind Command with button OR if want to do in code behind you can hook Click event of button to determine which image is clicked on.

这篇关于如何制作可点击的列表框?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！