基于modern ui for wpf的在线公开课平台 之五 使用ListBox实现图片列表效果

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/wuma0q1an/article/details/50895164

关于ListBox实现图片列表效果。下面是效果图。

下面是前端xaml代码

<UserControl x:Class="zxgkkpt.Pages.MyCourse.ListAll.PicAndList.ListShow"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/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" 
             xmlns:mui="http://firstfloorsoftware.com/ModernUI"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <Grid>
        <ListBox Grid.Column="2" ItemsSource="{Binding}" x:Name="listBox1" Width="Auto" Height="500" MouseDoubleClick="listBox1_MouseDoubleClick" Margin="0,0,0,-60">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid    HorizontalAlignment="Center">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition  Width="80" ></ColumnDefinition>
                            <ColumnDefinition  Width="500" ></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <Image Source="{Binding Image}"  Grid.Column="0" Width="80" Height="80" HorizontalAlignment="Left"/>
                        <Grid Grid.Column="1" Height="80">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"></RowDefinition>
                                <RowDefinition Height="Auto"></RowDefinition>
                                <RowDefinition Height="Auto"></RowDefinition>
                                <RowDefinition Height="Auto"></RowDefinition>
                            </Grid.RowDefinitions>
                            <TextBlock Text="{Binding Name}" Grid.Row="0"  HorizontalAlignment="Left"  FontSize="8pt" TextWrapping="Wrap"  />
                            <TextBlock Text="{Binding Type}" Grid.Row="1"></TextBlock>
                            <TextBlock Text="{Binding Upperson}" Grid.Row="2"></TextBlock>
                            <TextBlock Text="{Binding Uptime}" Grid.Row="3"></TextBlock>
                        </Grid>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>
</UserControl>

绑定数据方法和上篇一样，就不重复贴了http://blog.csdn.net/wuma0q1an/article/details/50894980