asp.net silverlight中使用listbox展示数据
通过后台绑定的方式绑定listbox的数据,包括模板样式;效果如下:
前台页面:
代码如下 | 复制代码 |
<Window.Resources>
<!--listbox滚轮平缓动画效果--> <ItemsPanelTemplate x:Key="ItemsPanelTemplate1"> <VirtualizingStackPanel IsItemsHost="True"> <i:Interaction.Behaviors> <ei:FluidMoveBehavior AppliesTo="Children"/> </i:Interaction.Behaviors> </VirtualizingStackPanel> </ItemsPanelTemplate> </Window.Resources> <Grid>
<ListBox Height="427" Margin="7,6,8,0" x:Name="listBox1" VerticalAlignment="Top" d:LayoutOverrides="GridBox" ItemsPanel="{DynamicResource ItemsPanelTemplate1}" > <!--选定项背景色设置--> <ListBox.Resources> <Style TargetType="{x:Type ListBoxItem}"> <Style.Resources> <!--选中时的背景颜色--> <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="#FFF0F0F0"/> <!--选中时的字体颜色--> <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Green"/> </Style.Resources> </Style> </ListBox.Resources> <ListBox.ItemTemplate> <DataTemplate> <!--修改圆角外边--> <Border BorderThickness="5" BorderBrush="#FFD9D6D6" Margin="0,5,0,0" CornerRadius="5" > <StackPanel Orientation="Horizontal" Width="400" Background="#FFD9D6D6"> <StackPanel Height="80" Margin="10,0,0,0" HorizontalAlignment="Center" Background="#FFF5F3F3"> <Image Source="{Binding Image}" Style="{StaticResource imagestyle}" /> <Canvas Height="1" Margin="0,40,0,0" Background="Black"/> </StackPanel> <StackPanel Width="250" Margin="20,0,0,0">
<TextBlock Text="{Binding Title}" Style="{StaticResource titlestyle}"/>
<TextBlock Text="{Binding Author}" Style="{StaticResource authorstyle}"/> <TextBlock Text="{Binding Time}" Style="{StaticResource timestyle}"/> <!--<Canvas Height="1" Margin="0,40,0,0" Background="Black"/>--> </StackPanel> </StackPanel> </Border> </DataTemplate> </ListBox.ItemTemplate> </ListBox> </Grid> |
app.xaml页面里有模板样式:
代码如下 | 复制代码 |
<!--时间字段显示样式--> <Style x:Key="timestyle" TargetType="TextBlock"> <Setter Property="HorizontalAlignment" Value="Left"></Setter> <Setter Property="FontSize" Value="12"></Setter> <Setter Property="Foreground" Value="DarkSlateGray"></Setter> <Setter Property="Margin" Value="0,10,0,0"></Setter> </Style> <!--作者字段显示样式--> <Style x:Key="authorstyle" TargetType="TextBlock"> <Setter Property="HorizontalAlignment" Value="Left"></Setter> <Setter Property="FontSize" Value="12"/> <Setter Property="Foreground" Value="DarkSlateGray"/> <Setter Property="Margin" Value="0,10,0,0"></Setter> </Style> <!--标题字段显示样式--> <Style x:Key="titlestyle" TargetType="TextBlock"> <Setter Property="HorizontalAlignment" Value="Left"></Setter> <Setter Property="FontSize" Value="15"/> <Setter Property="FontWeight" Value="Bold"/> <Setter Property="Foreground" Value="DarkSlateGray"/> </Style> <!--图片字段显示样式--> <Style x:Key="imagestyle" TargetType="Image"> <Setter Property="Height" Value="80" /> <Setter Property="Width" Value="80"/> </Style> |
后台页面:
代码如下 | 复制代码 |
public partial class MainWindow : Window
{ public MainWindow() { InitializeComponent(); var Persons = new List<person>();
for (int i = 0; i < 10; i++) { Persons.Add(new person {Image="/Image/user00"+i+".png", Title = "关注的人最新更新:" + i.ToString(), Time = "创建时间:" + DateTime.Now.ToShortDateString().ToString() ,Author="作者:"+i.ToString()}); } listBox1.ItemsSource = Persons; }
public class person { private string image; public string Image
{ get { return image; } set { image = value; } } private string title; public string Title
{ get { return title; } set { title = value; } } private string time; public string Time
{ get { return time; } set { time = value; } } private string author; public string Author
{ get { return author; } set { author = value; } } } } |
补充:asp.net教程,.Net开发