Updated OneWaySeq sample

xperiandri · May 16, 2021 · d51f144 · d51f144
1 parent 5b0d142
commit d51f144
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 10 deletions.
diff --git a/src/Samples/Samples.Shared/OneWaySeqPage.xaml b/src/Samples/Samples.Shared/OneWaySeqPage.xaml
@@ -1,12 +1,19 @@
-<Page d:DataContext="{d:DesignInstance Type=samples:DesignData, IsDesignTimeCreatable=True}"
+<Page
   x:Class="Elmish.Uno.Samples.OneWaySeq.OneWaySeqPage"
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
   xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
   xmlns:samples="using:Elmish.Uno.Samples"
+  mc:Ignorable="d"
   Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
-  mc:Ignorable="d">
+  d:DataContext="{d:DesignInstance Type=samples:DesignData, IsDesignTimeCreatable=True}">
+
+  <Page.Resources>
+    <Style TargetType="TextBlock">
+      <Setter Property="Margin" Value="10" />
+    </Style>
+  </Page.Resources>
 
   <Grid d:DataContext="{Binding OneWaySeq}">
     <Grid.RowDefinitions>
@@ -18,20 +25,21 @@
     <Grid.ColumnDefinitions>
       <ColumnDefinition Width="*" />
       <ColumnDefinition Width="*" />
+      <ColumnDefinition Width="1.5*" />
     </Grid.ColumnDefinitions>
 
     <TextBlock
-      Grid.ColumnSpan="2"
+      Grid.ColumnSpan="3"
       Margin="10"
       Text="This sample shows the difference between Binding.oneWay and Binding.oneWaySeq. For oneWay, the whole ListView is re-rendered for every change. For oneWaySeq, only the new item is added."
       TextWrapping="Wrap" />
     <TextBlock
       Grid.Row="1"
-      Margin="0,0,0,10"
       HorizontalAlignment="Center"
       FontSize="16"
       FontWeight="Bold"
-      Text="Binding.oneWay" />
+      Text="Binding. oneWay"
+      TextWrapping="WrapWholeWords" />
     <Button
       Grid.Row="2"
       Width="150"
@@ -43,11 +51,11 @@
     <TextBlock
       Grid.Row="1"
       Grid.Column="1"
-      Margin="0,0,0,10"
       HorizontalAlignment="Center"
       FontSize="16"
       FontWeight="Bold"
-      Text="Binding.oneWaySeq" />
+      Text="Binding. oneWaySeq"
+      TextWrapping="WrapWholeWords" />
     <Button
       Grid.Row="2"
       Grid.Column="1"
@@ -60,5 +68,27 @@
       Grid.Row="3"
       Grid.Column="1"
       ItemsSource="{Binding OneWaySeqNumbers}" />
+    <TextBlock
+      Grid.Row="1"
+      Grid.Column="2"
+      HorizontalAlignment="Center"
+      FontSize="16"
+      TextWrapping="WrapWholeWords">
+      <Bold><Run Text="Binding. oneWaySeq" /></Bold>
+      <Run Text="with incremental loading" />
+    </TextBlock>
+    <TextBlock
+      Grid.Row="2"
+      Grid.Column="2"
+      Margin="10,0,10,0"
+      HorizontalAlignment="Center"
+      FontSize="16"
+      FontWeight="Bold"
+      Text="Never insert loaded items to the top as it will cause constant loading, if HasMoreItems is always true"
+      TextWrapping="WrapWholeWords" />
+    <ListView
+      Grid.Row="3"
+      Grid.Column="2"
+      ItemsSource="{Binding IncrementalLoadingNumbers}" />
   </Grid>
 </Page>
diff --git a/src/Samples/Samples/OneWaySeq.fs b/src/Samples/Samples/OneWaySeq.fs
@@ -1,31 +1,44 @@
 module Elmish.Uno.Samples.OneWaySeq.Program
 
-open System
+open System.Threading.Tasks
+open FSharp.Collections.Immutable
 open Elmish
 open Elmish.Uno
 
 
 type Model =
   { OneWaySeqNumbers: int list
-    OneWayNumbers: int list }
+    OneWayNumbers: int list
+    IncrementalLoadingNumbers: int FlatList }
 
 let initial =
   { OneWaySeqNumbers = [ 1000..-1..1 ]
-    OneWayNumbers = [ 1000..-1..1 ] }
+    OneWayNumbers = [ 1000..-1..1 ]
+    IncrementalLoadingNumbers = [ 1..1..10 ] |> FlatList.ofSeq }
 
 let init () = initial
 
 type Msg =
   | AddOneWaySeqNumber
   | AddOneWayNumber
+  | LoadMore of count: uint * tcs: TaskCompletionSource<uint>
 
 let update msg m =
   match msg with
   | AddOneWaySeqNumber -> { m with OneWaySeqNumbers = m.OneWaySeqNumbers.Head + 1 :: m.OneWaySeqNumbers }
   | AddOneWayNumber -> { m with OneWayNumbers = m.OneWayNumbers.Head + 1 :: m.OneWayNumbers }
+  | LoadMore (count, tcs) ->
+    let intCount = int count
+    let builder = m.IncrementalLoadingNumbers.ToBuilder()
+    let max = FlatList.last m.IncrementalLoadingNumbers
+    for i = max + 1 to max + intCount do
+      builder.Add(i)
+    tcs.SetResult(count)
+    { m with IncrementalLoadingNumbers = builder.ToImmutable() }
 
 let bindings : Binding<Model, Msg> list = [
   "OneWaySeqNumbers" |> Binding.oneWaySeq ((fun m -> m.OneWaySeqNumbers), (=), id)
+  "IncrementalLoadingNumbers" |> Binding.oneWaySeq ((fun m -> m.IncrementalLoadingNumbers), (=), id, (fun _ -> true), LoadMore)
   "OneWayNumbers" |> Binding.oneWay (fun m -> m.OneWayNumbers)
   "AddOneWaySeqNumber" |> Binding.cmd AddOneWaySeqNumber
   "AddOneWayNumber" |> Binding.cmd AddOneWayNumber