|
5 | 5 | xmlns:utu="using:Uno.Toolkit.UI"
|
6 | 6 | Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
|
7 | 7 |
|
| 8 | + <!-- Reusable templates --> |
| 9 | + <Page.Resources> |
| 10 | + <DataTemplate x:Key="PersonDetailsTemplate"> |
| 11 | + <Grid> |
| 12 | + <Grid.RowDefinitions> |
| 13 | + <RowDefinition Height="Auto" /> |
| 14 | + <RowDefinition /> |
| 15 | + </Grid.RowDefinitions> |
| 16 | + <StackPanel Grid.Row="1"> |
| 17 | + <TextBlock Text="Selected Person Details:" |
| 18 | + FontWeight="Bold" |
| 19 | + FontSize="16" /> |
| 20 | + <TextBlock> |
| 21 | + <Run Text="First Name: " /> |
| 22 | + <Run Text="{Binding Data.FirstName}" /> |
| 23 | + </TextBlock> |
| 24 | + <TextBlock> |
| 25 | + <Run Text="Last Name: " /> |
| 26 | + <Run Text="{Binding Data.LastName}" /> |
| 27 | + </TextBlock> |
| 28 | + <Button Grid.Row="0" |
| 29 | + Content="Refresh" |
| 30 | + Command="{Binding Refresh}" |
| 31 | + Margin="10" /> |
| 32 | + </StackPanel> |
| 33 | + </Grid> |
| 34 | + </DataTemplate> |
| 35 | + |
| 36 | + <!-- Custom Progress Template --> |
| 37 | + <DataTemplate x:Key="CustomProgressTemplate"> |
| 38 | + <TextBlock Text="Loading person details, please wait..." |
| 39 | + HorizontalAlignment="Center" |
| 40 | + VerticalAlignment="Center" /> |
| 41 | + </DataTemplate> |
| 42 | + |
| 43 | + <!-- Error Template --> |
| 44 | + <DataTemplate x:Key="ErrorTemplate"> |
| 45 | + <TextBlock Text="Failed to load person details. Please try again later." |
| 46 | + Foreground="Red" |
| 47 | + HorizontalAlignment="Center" |
| 48 | + VerticalAlignment="Center" /> |
| 49 | + </DataTemplate> |
| 50 | + </Page.Resources> |
| 51 | + |
8 | 52 | <Grid utu:SafeArea.Insets="Bottom,Top">
|
9 | 53 | <StackPanel>
|
10 | 54 | <TextBlock Text="FeedView Sample: Default Loading, Custom Loading, and Error"
|
11 | 55 | FontSize="16"
|
12 | 56 | Margin="10"
|
13 | 57 | TextWrapping="Wrap" />
|
14 | 58 |
|
15 |
| - <!--Default Loading with FeedView --> |
16 |
| - <TextBlock Text="1. Default Loading:" FontWeight="Bold" FontSize="14" Margin="10,0"/> |
17 |
| - <mvux:FeedView Source="{Binding DefaultPerson}"> |
18 |
| - <mvux:FeedView.ValueTemplate> |
19 |
| - <DataTemplate> |
20 |
| - <Grid> |
21 |
| - <Grid.RowDefinitions> |
22 |
| - <RowDefinition Height="Auto" /> |
23 |
| - <RowDefinition /> |
24 |
| - </Grid.RowDefinitions> |
25 |
| - <StackPanel Grid.Row="1"> |
26 |
| - <TextBlock Text="Selected Person Details:" |
27 |
| - FontWeight="Bold" |
28 |
| - FontSize="16" /> |
29 |
| - <TextBlock> |
30 |
| - <Run Text="First Name:" /> |
31 |
| - <Run Text="{Binding Data.FirstName}" /> |
32 |
| - </TextBlock> |
33 |
| - <TextBlock> |
34 |
| - <Run Text="Last Name:" /> |
35 |
| - <Run Text="{Binding Data.LastName}" /> |
36 |
| - </TextBlock> |
37 |
| - <Button Grid.Row="0" |
38 |
| - Content="Refresh" |
39 |
| - Command="{Binding Refresh}" |
40 |
| - Margin="10" /> |
41 |
| - </StackPanel> |
42 |
| - </Grid> |
43 |
| - </DataTemplate> |
44 |
| - </mvux:FeedView.ValueTemplate> |
45 |
| - </mvux:FeedView> |
| 59 | + <!-- Default Loading with FeedView --> |
| 60 | + <TextBlock Text="1. Default Loading:" |
| 61 | + FontWeight="Bold" |
| 62 | + FontSize="14" |
| 63 | + Margin="10,0" /> |
| 64 | + <mvux:FeedView Source="{Binding DefaultPerson}" |
| 65 | + ValueTemplate="{StaticResource PersonDetailsTemplate}" /> |
46 | 66 |
|
47 | 67 | <!-- Custom Loading Message with FeedView -->
|
48 |
| - <TextBlock Text="2. Custom Loading Message:" FontWeight="Bold" FontSize="14" Margin="10,20,0,0"/> |
49 |
| - <mvux:FeedView Source="{Binding CustomLoadingPerson}"> |
50 |
| - <mvux:FeedView.ValueTemplate> |
51 |
| - <DataTemplate> |
52 |
| - <Grid> |
53 |
| - <Grid.RowDefinitions> |
54 |
| - <RowDefinition Height="Auto" /> |
55 |
| - <RowDefinition /> |
56 |
| - </Grid.RowDefinitions> |
57 |
| - <StackPanel Grid.Row="1"> |
58 |
| - <TextBlock Text="Selected Person Details:" |
59 |
| - FontWeight="Bold" |
60 |
| - FontSize="16" /> |
61 |
| - <TextBlock> |
62 |
| - <Run Text="First Name:" /> |
63 |
| - <Run Text="{Binding Data.FirstName}" /> |
64 |
| - </TextBlock> |
65 |
| - <TextBlock> |
66 |
| - <Run Text="Last Name:" /> |
67 |
| - <Run Text="{Binding Data.LastName}" /> |
68 |
| - |
69 |
| - </TextBlock> |
70 |
| - |
71 |
| - <Button Grid.Row="0" |
72 |
| - Content="Refresh" |
73 |
| - Command="{Binding Refresh}" |
74 |
| - Margin="10" /> |
75 |
| - </StackPanel> |
76 |
| - </Grid> |
77 |
| - </DataTemplate> |
78 |
| - </mvux:FeedView.ValueTemplate> |
79 |
| - |
80 |
| - <!-- Custom loading message --> |
81 |
| - <mvux:FeedView.ProgressTemplate> |
82 |
| - <DataTemplate> |
83 |
| - <TextBlock Text="Loading person details, please wait..." |
84 |
| - HorizontalAlignment="Center" |
85 |
| - VerticalAlignment="Center" /> |
86 |
| - </DataTemplate> |
87 |
| - </mvux:FeedView.ProgressTemplate> |
88 |
| - </mvux:FeedView> |
| 68 | + <TextBlock Text="2. Custom Loading Message:" |
| 69 | + FontWeight="Bold" |
| 70 | + FontSize="14" |
| 71 | + Margin="10,20,0,0" /> |
| 72 | + <mvux:FeedView Source="{Binding CustomLoadingPerson}" |
| 73 | + ValueTemplate="{StaticResource PersonDetailsTemplate}" |
| 74 | + ProgressTemplate="{StaticResource CustomProgressTemplate}" /> |
89 | 75 |
|
90 | 76 | <!-- Error Handling in FeedView -->
|
91 |
| - <TextBlock Text="3. Error Handling:" FontWeight="Bold" FontSize="14" Margin="10,20,0,0"/> |
92 |
| - <mvux:FeedView Source="{Binding ErrorPerson}"> |
93 |
| - <mvux:FeedView.ValueTemplate> |
94 |
| - <DataTemplate> |
95 |
| - <StackPanel> |
96 |
| - <TextBlock Text="Selected Person Details:" |
97 |
| - FontWeight="Bold" |
98 |
| - FontSize="16" /> |
99 |
| - <TextBlock Text="First Name:" /> |
100 |
| - <TextBlock Text="{Binding Data.FirstName}" /> |
101 |
| - <TextBlock Text="Last Name:" /> |
102 |
| - <TextBlock Text="{Binding Data.LastName}" /> |
103 |
| - </StackPanel> |
104 |
| - </DataTemplate> |
105 |
| - </mvux:FeedView.ValueTemplate> |
106 |
| - |
107 |
| - <!-- Error template to display in case of an error --> |
108 |
| - <mvux:FeedView.ErrorTemplate> |
109 |
| - <DataTemplate> |
110 |
| - <TextBlock Text="Failed to load person details. Please try again later." |
111 |
| - Foreground="Red" |
112 |
| - HorizontalAlignment="Center" |
113 |
| - VerticalAlignment="Center" /> |
114 |
| - </DataTemplate> |
115 |
| - </mvux:FeedView.ErrorTemplate> |
116 |
| - </mvux:FeedView> |
| 77 | + <TextBlock Text="3. Error Handling:" |
| 78 | + FontWeight="Bold" |
| 79 | + FontSize="14" |
| 80 | + Margin="10,20,0,0" /> |
| 81 | + <mvux:FeedView Source="{Binding ErrorPerson}" |
| 82 | + ValueTemplate="{StaticResource PersonDetailsTemplate}" |
| 83 | + ErrorTemplate="{StaticResource ErrorTemplate}" /> |
117 | 84 | </StackPanel>
|
118 | 85 | </Grid>
|
119 | 86 | </Page>
|
0 commit comments