feat: implement RefreshContainer.

This commit is contained in:
Zhang Dian 2024-02-24 16:49:31 +08:00
parent 4efc6bf4ec
commit 157d22a8f9
3 changed files with 63 additions and 18 deletions

View File

@ -4,12 +4,24 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:pages="clr-namespace:Semi.Avalonia.Demo.Pages"
d:DesignHeight="450" d:DesignHeight="450"
d:DesignWidth="800" d:DesignWidth="800"
x:DataType="pages:RefreshContainerDemoViewModel"
x:CompileBindings="True"
mc:Ignorable="d"> mc:Ignorable="d">
<StackPanel HorizontalAlignment="Left" Spacing="20"> <DockPanel HorizontalAlignment="Stretch" VerticalAlignment="Top">
<RefreshContainer Name="container"> <Label DockPanel.Dock="Top">A control that supports pull to refresh</Label>
<TextBlock Text="Content" /> <RefreshContainer Name="Refresh"
DockPanel.Dock="Bottom"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
PullDirection="TopToBottom"
RefreshRequested="RefreshContainerPage_RefreshRequested"
Margin="5">
<ListBox HorizontalAlignment="Stretch"
VerticalAlignment="Top"
ItemsSource="{Binding Items}" />
</RefreshContainer> </RefreshContainer>
</StackPanel> </DockPanel>
</UserControl> </UserControl>

View File

@ -1,14 +1,46 @@
using Avalonia; using System.Collections.ObjectModel;
using System.Linq;
using System.Threading.Tasks;
using Avalonia.Controls; using Avalonia.Controls;
using Avalonia.Interactivity; using CommunityToolkit.Mvvm.ComponentModel;
using Avalonia.Markup.Xaml;
namespace Semi.Avalonia.Demo.Pages; namespace Semi.Avalonia.Demo.Pages;
public partial class RefreshContainerDemo : UserControl public partial class RefreshContainerDemo : UserControl
{ {
private RefreshContainerDemoViewModel _viewModel;
public RefreshContainerDemo() public RefreshContainerDemo()
{ {
InitializeComponent(); InitializeComponent();
_viewModel = new RefreshContainerDemoViewModel();
DataContext = _viewModel;
}
private async void RefreshContainerPage_RefreshRequested(object? sender, RefreshRequestedEventArgs e)
{
var deferral = e.GetDeferral();
await _viewModel.AddToTop();
deferral.Complete();
}
}
public class RefreshContainerDemoViewModel : ObservableObject
{
public ObservableCollection<string> Items { get; }
public RefreshContainerDemoViewModel()
{
Items = new ObservableCollection<string>(Enumerable.Range(1, 200).Select(i => $"Item {i}"));
}
public async Task AddToTop()
{
await Task.Delay(1000);
Items.Insert(0, $"Item {200 - Items.Count}");
} }
} }

View File

@ -30,18 +30,19 @@
<Setter Property="Height" Value="100" /> <Setter Property="Height" Value="100" />
<Setter Property="Background" Value="{DynamicResource RefreshContainerIconBackground}" /> <Setter Property="Background" Value="{DynamicResource RefreshContainerIconBackground}" />
<Setter Property="Foreground" Value="{DynamicResource RefreshContainerIconForeground}" /> <Setter Property="Foreground" Value="{DynamicResource RefreshContainerIconForeground}" />
<Setter Property="Content">
<Template>
<PathIcon Name="PART_Icon"
Data="{DynamicResource RefreshContainerIconGlyph}"
Width="24"
Height="24" />
</Template>
</Setter>
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate> <ControlTemplate>
<Grid <Grid Name="PART_Root"
Name="PART_Root"
MinHeight="80" MinHeight="80"
Background="{TemplateBinding Background}"> Background="{TemplateBinding Background}" />
<Grid.Styles>
<Style Selector="PathIcon#PART_Icon">
<Setter Property="Data" Value="{DynamicResource RefreshContainerIconGlyph}" />
</Style>
</Grid.Styles>
</Grid>
</ControlTemplate> </ControlTemplate>
</Setter> </Setter>
</ControlTheme> </ControlTheme>