WindowsCommunityToolkit/CommunityToolkit.WinUI.SampleApp/SamplePages/ListDetailsView/ListDetailsView.bind at 4d8c70b69764e0d7a59a38e3a2b6c86bcb00eb41 · unliftedq/WindowsCommunityToolkit · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
<Page
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="using:CommunityToolkit.WinUI.UI.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:models="using:CommunityToolkit.WinUI.SampleApp.Models"
    mc:Ignorable="d">

    <Grid>
        <controls:ListDetailsView BackButtonBehavior="Automatic"
                                    ItemsSource="{Binding Emails}"
                                    NoSelectionContent="Select an item to view"
                                    CompactModeThresholdWidth="720"
                                    ListPaneWidth="400">
            <controls:ListDetailsView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Margin="0,8">
                        <TextBlock Text="{Binding From}"
                                   Style="{StaticResource SubtitleTextBlockStyle}"/>
                        <TextBlock Text="{Binding Subject}"
                                   Style="{StaticResource BodyTextBlockStyle}"
                                   Foreground="{ThemeResource Brush-Blue-01}"
                                   MaxLines="1"/>
                        <TextBlock Text="{Binding Body}"
                                   Style="{StaticResource BodyTextBlockStyle}"
                                   Opacity=".6"
                                   MaxLines="1"/>
                    </StackPanel>
                </DataTemplate>
            </controls:ListDetailsView.ItemTemplate>
            <controls:ListDetailsView.DetailsTemplate>
                <DataTemplate>
                    <RelativePanel Margin="24">
                        <controls:ImageEx x:Name="FromEllipse"
                                               Source="{Binding Thumbnail}"
                                               Width="50"
                                               Height="50"
                                               CornerRadius="999"/>
                        <TextBlock Text="{Binding From}"
                                   Style="{StaticResource SubtitleTextBlockStyle}"
                                   RelativePanel.RightOf="FromEllipse"
                                   Margin="12,-6,0,0"/>
                        <TextBlock x:Name="SubjectLine"
                                   Text="{Binding Subject}"
                                   Style="{StaticResource BodyTextBlockStyle}"
                                   RelativePanel.Below="FromEllipse"
                                   Margin="0,12,0,0"/>
                        <TextBlock x:Name="Body"
                                   Text="{Binding Body}"
                                   Style="{StaticResource BodyTextBlockStyle}"
                                   TextWrapping="Wrap"
                                   RelativePanel.Below="SubjectLine"
                                   Margin="0,12,0,0"/>
                    </RelativePanel>
                </DataTemplate>
            </controls:ListDetailsView.DetailsTemplate>
            <controls:ListDetailsView.NoSelectionContentTemplate>
                <DataTemplate>
                    <StackPanel HorizontalAlignment="Center"
                                VerticalAlignment="Center">
                        <SymbolIcon Symbol="Mail"
                                    RenderTransformOrigin=".5,.5">
                            <SymbolIcon.RenderTransform>
                                <CompositeTransform
                                  ScaleX="2"
                                  ScaleY="2"/>
                            </SymbolIcon.RenderTransform>
                        </SymbolIcon>
                        <TextBlock Text="{Binding}"
                                   FontSize="24"
                                   Margin="0,12"/>
                    </StackPanel>
                </DataTemplate>
            </controls:ListDetailsView.NoSelectionContentTemplate>
            <controls:ListDetailsView.ListCommandBar>
                <CommandBar>
                    <!-- Button functionality to be implemented by developer -->
                    <AppBarButton Icon="Back" Label="Back"/>
                    <AppBarButton Icon="Forward" Label="Forward"/>
                  <CommandBar.Content>
                    <TextBlock Margin="12,14">
                      <Run Text="{Binding Emails.Count}" />
                      <Run Text="Items" />
                    </TextBlock>
                  </CommandBar.Content>
                </CommandBar>
      </controls:ListDetailsView.ListCommandBar>
      <controls:ListDetailsView.DetailsCommandBar>
        <CommandBar>
          <!-- Button functionality to be implemented by developer -->
          <AppBarButton Icon="MailReply" Label="Reply" />
          <AppBarButton Icon="MailReplyAll" Label="Reply All" />
          <AppBarButton Icon="MailForward" Label="Forward" />
        </CommandBar>
      </controls:ListDetailsView.DetailsCommandBar>
    </controls:ListDetailsView>
  </Grid>
</Page>