• WPF自定义ListBox样式


     1  <!--竖向-->
     2         <Style x:Key="ListBoxStyle1" TargetType="{x:Type ListBox}">
     3             <Setter Property="ItemTemplate">
     4                 <Setter.Value>
     5                     <DataTemplate>
     6                         <Grid>
     7                             <Grid.ColumnDefinitions>
     8                                 <ColumnDefinition Width="Auto"/>
     9                                 <ColumnDefinition Width="*" SharedSizeGroup="MiddleCoiumn"/>
    10                                 <ColumnDefinition Width="Auto"/>
    11                             </Grid.ColumnDefinitions>
    12                             <Grid.RowDefinitions>
    13                                 <RowDefinition Height="60"/>
    14                             </Grid.RowDefinitions>
    15                             <TextBlock FontSize="16" VerticalAlignment="Center" Margin="5" FontStyle="Italic" Grid.Column="0" Text="Country:"/>
    16                             <TextBlock FontSize="16" VerticalAlignment="Center" Margin="5"  Grid.Column="1" Text="{Binding Name}" FontWeight="Bold"/>
    17                             <Border Margin="4,0" Grid.Column="2" BorderThickness="2" CornerRadius="4">
    18                                 <Border.BorderBrush>
    19                                     <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
    20                                         <GradientStop Offset="0" Color="#aaa"/>
    21                                         <GradientStop Offset="1" Color="#222"/>
    22                                     </LinearGradientBrush>
    23                                 </Border.BorderBrush>
    24                                 <Grid>
    25                                     <Rectangle>
    26                                         <Rectangle.Fill>
    27                                             <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
    28                                                 <GradientStop Offset="0" Color="#444"/>
    29                                                 <GradientStop Offset="1" Color="#fff"/>
    30                                             </LinearGradientBrush>
    31                                         </Rectangle.Fill>
    32                                     </Rectangle>
    33                                     <Image Width="48" Margin="2,2,2,1" Source="{Binding ImagePath}"/>
    34                                 </Grid>
    35                             </Border>
    36                         </Grid>
    37                     </DataTemplate>
    38                 </Setter.Value>
    39             </Setter>
    40             <Setter Property="Grid.IsSharedSizeScope" Value="True"/>
    41         </Style>
    42         <!--横向-->
    43         <Style x:Key="ListBoxStyle2" TargetType="{x:Type ListBox}" BasedOn="{StaticResource ListBoxStyle1}">
    44             <Setter Property="Template">
    45                 <Setter.Value>
    46                     <ControlTemplate TargetType="{x:Type ListBox}">
    47                         <ScrollViewer HorizontalScrollBarVisibility="Auto">
    48                             <StackPanel Name="StackPanel1" IsItemsHost="True" Orientation="Horizontal"/>
    49                         </ScrollViewer>
    50                     </ControlTemplate>
    51                 </Setter.Value>
    52             </Setter>
    53             <Setter Property="VerticalAlignment" Value="Center"></Setter>
    54         </Style>
    55         <!--平铺-->
    56         <Style x:Key="ListBoxStyle3" TargetType="{x:Type ListBox}">
    57             <Setter Property="Template">
    58                 <Setter.Value>
    59                     <ControlTemplate TargetType="{x:Type ListBox}">
    60                         <ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled">
    61                             <WrapPanel IsItemsHost="True"/>
    62                         </ScrollViewer>
    63                     </ControlTemplate>
    64                 </Setter.Value>
    65             </Setter>
    66             <Setter Property="ItemTemplate">
    67                 <Setter.Value>
    68                     <DataTemplate>
    69                         <Grid>
    70                             <Grid.ColumnDefinitions>
    71                                 <ColumnDefinition Width="140"/>
    72                             </Grid.ColumnDefinitions>
    73                             <Grid.RowDefinitions>
    74                                 <RowDefinition Height="60"/>
    75                                 <RowDefinition Height="30"/>
    76                             </Grid.RowDefinitions>
    77                             <Image Grid.Row="0"  Width="48" Margin="2,2,2,1" Source="{Binding ImagePath}"/>
    78                             <TextBlock Grid.Row="1" FontSize="14" HorizontalAlignment="Center" Margin="5" Text="{Binding Name}"/>
    79                         </Grid>
    80                     </DataTemplate>
    81                 </Setter.Value>
    82             </Setter>
    83         </Style>

    应用

    <Grid >
    <ListBox ItemsSource="{Binding}" Margin="10" Style="{StaticResource ListBoxStyle3}"></ListBox>
    </Grid>

    数据支持:

     1 public partial class 数据模板 : Window
     2     {
     3         public 数据模板()
     4         {
     5             InitializeComponent();
     6             this.DataContext = Countries.GetCountry();
     7         }
     8 
     9 
    10     }
    11     public class Country
    12     {
    13         public string Name { get; set; }
    14         public string ImagePath { get; set; }
    15 
    16         public override string ToString()
    17         {
    18             return Name;
    19         }
    20     }
    21 
    22 
    23     public class Countries
    24     {
    25         public static IEnumerable<Country> GetCountry()
    26         {
    27             return new List<Country> {
    28                 new Country {   Name = "Austria1",ImagePath = "1.jpg"},
    29                 new Country {   Name = "Austria2",ImagePath = "1.jpg"},
    30                 new Country {   Name = "Austria3",ImagePath = "1.jpg"},
    31                 new Country {   Name = "Austria4",ImagePath = "1.jpg"},
    32 
    33             };
    34         }
    35     }
  • 相关阅读:
    占位
    阳光服务平台-敏捷开发
    两种方法实现带验证码的用户登录
    红警大战JAVA简单版
    JPanel与JFrame的区别
    java中import详解
    敏捷开发
    GitHub:本地项目上传与团队协作
    从结缘计算机到未来规划
    (三)微信小程序首页的分类功能和搜索功能的实现笔记
  • 原文地址:https://www.cnblogs.com/saodiseng2015/p/5811076.html
Copyright © 2020-2023  润新知