Use listbox to display data in asp.net silverlight

Bind the data of listbox in the background, including the template style. The effect is as follows:

Front-end page:

The code is as follows:

Copy code

<Window. Resources> <! -- Listbox scroll wheel smooth animation effect --> <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 = "," x: Name = "listBox1" verticalignment = "Top" d: layoutOverrides = "GridBox" ItemsPanel = "{DynamicResource ItemsPanelTemplate1}">             <! -- Set the background color of the selected item --> <ListBox. Resources> <Style TargetType = "{x: Type ListBoxItem}"> <Style. Resources> <! -- Selected background color --> <SolidColorBrush x: Key = "{x: Static SystemColors. HighlightBrushKey}" Color = "# FFF0F0F0"/> <! -- Font color when selected --> <SolidColorBrush x: Key = "{x: Static SystemColors. HighlightTextBrushKey}" Color = "Green"/> </Style. Resources> </Style> </ListBox. Resources>                                        <ListBox. ItemTemplate> <DataTemplate> <! -- Modify the outer corner --> <Border BorderThickness = "5" BorderBrush = "# FFD9D6D6" Margin = "," 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 = "," Background = "Black"/> </StackPanel> <StackPanel Width = "250" Margin = "20, 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 = "," Background = "Black"/> --> </StackPanel> </StackPanel> </Border> </DataTemplate> </ListBox. ItemTemplate> </ListBox> </Grid>

 

 

The app. xaml page contains the template style:

The code is as follows:

Copy code

<! -- Display style of the time field --> <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"> </Setter> </Style> <! -- Display style of the author field --> <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"> </Setter> </Style> <! -- Title field display 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> <! -- Display style of image fields --> <Style x: Key = "imagestyle" TargetType = "Image"> <Setter Property = "Height" Value = "80"/> <Setter Property = "Width" Value = "80"/> </Style>

 

Background page:

The code is as follows:

Copy code

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 =" latest updated by followers: "+ I. toString (), Time = "creation Time:" + DateTime. now. tow.datestring (). toString (), Author = "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 ;}             }         }     }