Wpf-qq Interface (v): The effect and deadline of QQ friends ' group list

Effect Analysis:

1, the left mouse button click Group name, can pop up a drop-down list, and the left arrow to the right to turn downward;

2, pop-up drop-down list contains the friend's avatar, friend's nickname, as well as a friend's personality signature or the latest news;

3, when the mouse moved to the friend line, can be a line of background color blue or orange;

4, when the mouse moved to the friend's avatar, can hover to display the friend's personal information.

In addition to these basic effects, there are many effects contained therein .... Feeling grouped lists works the hardest.

I have generally done that kind of effect, very unattractive. Did not achieve the same effect, do not analyze the idea, so as not to fraught.

It's ScrollViewer.

Front desk:

<scrollviewer verticalscrollbarvisibility="Auto"margin="8,0,10,10"Background="Transparent"> <ScrollViewer.Content> <stackpanel width=" the"orientation="Vertical"Horizontalalignment=" Left"Verticalalignment="Top"Name="Friendlistcontrol"/> </ScrollViewer.Content> </ScrollViewer>

Background:

Private voidWindow_Loaded (ObjectSender,routedeventargs e) {test.getgrouplist (). ToList (). ForEach (S={Expander T=NewExpander (); T.header=s; T.headertemplate= This. FindResource ("expanderheadertemplate") asDataTemplate; ListView v=NewListView (); V.itemssource=S.children; V.width=280; V.borderthickness=NewThickness (0); V.itemtemplate= This. FindResource ("friendlist") asDataTemplate; V.selectionmode=Selectionmode.single; T.content=v;                FRIENDLISTCONTROL.CHILDREN.ADD (t); //Object obj = this. FindResource ("Textblockstatestyle");                            }); }

Several custom resource dictionaries appear in the background code, including Expanderheadertemplate and Friendlist.

The resource dictionary (ResourceDictionary) code is as follows:

<resourcedictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="Http://schemas.microsoft.com/winfx/2006/xaml"> <datatemplate x:key="friendlist"> <Grid> <Grid.RowDefinitions> <rowdefinition height=" -"/> <rowdefinition height=" -"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <columndefinitio N width=" +"/> <columndefinition width=" the"/> </Grid.ColumnDefinitions> <image grid.column="0"grid.rowspan="2"Source="newfolder/basicqq.jpg"/> <!--friends List--<textblock text="{Binding Path=name}"margin="5,1,0,1"grid.column="1"grid.row="0"Textalignment=" Left"/> <textblock text="{Binding Path=signature}"margin="5,1,0,1"grid.column="1"grid.row="1"Textalignment=" Left"/> </Grid> </DataTemplate> <datatemplate x:key="expanderheadertemplate"> <WrapPanel> <textblock text="{Binding Path=name}"Textalignment=" Left"></TextBlock> <textblock text="["Textalignment=" Left"></TextBlock> <textblock text="{Binding Path=onlinefriendnum}"Textalignment=" Left"></TextBlock> <textblock text="/"Textalignment=" Left"></TextBlock> <textblock text="{Binding Path=totalfriendnum}"Textalignment=" Left"></TextBlock> <textblock text="]"Textalignment=" Left"></TextBlock> </WrapPanel> </DataTemplate> <style x:key="Textblockstatestyle"Targettype="{x:type TextBlock}"> <setter property="FontFamily"Value="Song Body"/> <setter property="FontSize"Value=" -"/> <setter property="Foreground"Value="#FF000000"/> <Style.Triggers> <trigger property="IsMouseOver"Value="True"> <setter property="BitmapEffect"> <Setter.Value> <outerglowbitmapeffect glowsize="3"Glowcolor="#FFFFFF"/> </Setter.Value> </Setter> </Trigger> </styl E.triggers> </Style></ResourceDictionary>

The last DataTemplate is superfluous, textblockstatestyle please ignore it by yourself.

Finally, attach my source address on GitHub: https://github.com/Danieldong0802/QQpresentation

Although it is semi-finished, but also spent a lot of my beginner's time to complete, a lot of shortcomings, look at your predecessors advice!

Wpf-qq Interface (v): The effect and deadline of QQ friends ' group list