UWP 下拉刷新控件(PullToRefreshControl)
最近项目里面有下拉刷新的需求,自己做了一个,效果还不错。
- <Style TargetType="local:PullToRefreshControl">
- <Setter Property="HeaderTemplate">
- <Setter.Value>
- <DataTemplate>
- <Grid>
- <StackPanel VerticalAlignment="Center" Orientation="Horizontal" Visibility="{Binding IsReachThreshold,Converter={StaticResource InversedBooleanToVisibilityConverter}}">
- <FontIcon FontSize="" FontFamily="Segoe UI Emoji" Glyph="↓" IsHitTestVisible="False" VerticalAlignment="Bottom"/>
- <TextBlock Margin="5,0,5,0" Text="下拉刷新" VerticalAlignment="Bottom"/>
- </StackPanel>
- <StackPanel VerticalAlignment="Center" Orientation="Horizontal" Visibility="{Binding IsReachThreshold, Converter={StaticResource BooleanToVisibilityConverter}}">
- <FontIcon FontSize="" FontFamily="Segoe UI Emoji" Glyph="↑" IsHitTestVisible="False" VerticalAlignment="Bottom"/>
- <TextBlock Margin="5,0,5,0" Text="释放立即刷新" VerticalAlignment="Bottom"/>
- </StackPanel>
- </Grid>
- </DataTemplate>
- </Setter.Value>
- </Setter>
- <Setter Property="Template">
- <Setter.Value>
- <ControlTemplate TargetType="local:PullToRefreshControl">
- <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Margin="{TemplateBinding Margin}">
- <ScrollViewer x:Name="ScrollViewer"
- VerticalScrollBarVisibility="Hidden">
- <StackPanel>
- <ContentControl x:Name="PanelHeader" ContentTemplate="{TemplateBinding HeaderTemplate}" HorizontalContentAlignment="Center" VerticalContentAlignment="Bottom" />
- <ContentPresenter x:Name="PanelContent" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
- </StackPanel>
- </ScrollViewer>
- </Border>
- </ControlTemplate>
- </Setter.Value>
- </Setter>
- </Style>
- [TemplatePart(Name = PanelHeader, Type = typeof(ContentControl))]
- [TemplatePart(Name = PanelContent, Type = typeof(ContentPresenter))]
- [TemplatePart(Name = ScrollViewer, Type = typeof(ScrollViewer))]
- public class PullToRefreshControl:ContentControl
- {
- #region Fields
- private const string PanelHeader = "PanelHeader";
- private const string PanelContent = "PanelContent";
- private const string ScrollViewer = "ScrollViewer";
- private ContentControl _panelHeader;
- private ContentPresenter _panelContent;
- private ScrollViewer _scrollViewer;
- #endregion
- #region Property
- /// <summary>
- /// The threshold for release to refresh,defautl value is 2/5 of PullToRefreshPanel's height.
- /// </summary>
- public double RefreshThreshold
- {
- get { return (double)GetValue(RefreshThresholdProperty); }
- set { SetValue(RefreshThresholdProperty, value); }
- }
- // Using a DependencyProperty as the backing store for RefreshThreshold. This enables animation, styling, binding, etc...
- public static readonly DependencyProperty RefreshThresholdProperty =
- DependencyProperty.Register("RefreshThreshold", typeof(double), typeof(PullToRefreshControl), new PropertyMetadata(0.0,new PropertyChangedCallback(OnRefreshThresholdChanged)));
- private static void OnRefreshThresholdChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
- {
- var pullToRefreshControl = d as PullToRefreshControl;
- pullToRefreshControl.UpdateContentGrid();
- }
- /// <summary>
- /// occur when reach threshold.
- /// </summary>
- public event EventHandler PullToRefresh;
- public DataTemplate HeaderTemplate
- {
- get { return (DataTemplate)GetValue(HeaderTemplateProperty); }
- set { SetValue(HeaderTemplateProperty, value); }
- }
- // Using a DependencyProperty as the backing store for HeaderTemplate. This enables animation, styling, binding, etc...
- public static readonly DependencyProperty HeaderTemplateProperty =
- DependencyProperty.Register("HeaderTemplate", typeof(DataTemplate), typeof(PullToRefreshControl), new PropertyMetadata(null));
- public bool IsReachThreshold
- {
- get { return (bool)GetValue(IsReachThresholdProperty); }
- set { SetValue(IsReachThresholdProperty, value); }
- }
- // Using a DependencyProperty as the backing store for IsReachThreshold. This enables animation, styling, binding, etc...
- public static readonly DependencyProperty IsReachThresholdProperty =
- DependencyProperty.Register("IsReachThreshold", typeof(bool), typeof(PullToRefreshControl), new PropertyMetadata(false));
- #endregion
- protected override void OnApplyTemplate()
- {
- _panelHeader = GetTemplateChild(PanelHeader) as ContentControl;
- _panelHeader.DataContext = this;
- _panelContent = GetTemplateChild(PanelContent) as ContentPresenter;
- _scrollViewer = GetTemplateChild(ScrollViewer) as ScrollViewer;
- _scrollViewer.ViewChanged += _scrollViewer_ViewChanged;
- base.OnApplyTemplate();
- }
- private void _scrollViewer_ViewChanged(object sender, ScrollViewerViewChangedEventArgs e)
- {
- //Sometime we can't make it to 0.0.
- IsReachThreshold = _scrollViewer.VerticalOffset <= 5.0;
- if (e.IsIntermediate)
- {
- return;
- }
- if (IsReachThreshold)
- {
- if (PullToRefresh!=null)
- {
- PullToRefresh(this, null);
- }
- }
- _panelHeader.Height = RefreshThreshold > _panelHeader.ActualHeight ? RefreshThreshold : _panelHeader.ActualHeight;
- this.Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, () =>
- {
- _scrollViewer.ChangeView(null, _panelHeader.Height, null);
- });
- }
- public PullToRefreshControl()
- {
- this.DefaultStyleKey = typeof(PullToRefreshControl);
- this.Loaded +=(s,e)=>
- {
- if (RefreshThreshold == 0.0)
- {
- RefreshThreshold = this.ActualHeight * / 5.0;
- }
- UpdateContentGrid();
- };
- this.SizeChanged += (s, e) =>
- {
- if (RefreshThreshold==0.0)
- {
- RefreshThreshold = this.ActualHeight * / 5.0;
- }
- UpdateContentGrid();
- };
- }
- #region Method
- private void UpdateContentGrid()
- {
- if (_scrollViewer != null && _panelContent!=null && _panelHeader !=null)
- {
- _panelHeader.Height = RefreshThreshold > _panelHeader.ActualHeight? RefreshThreshold: _panelHeader.ActualHeight;
- this.Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, () =>
- {
- _scrollViewer.ChangeView(null, _panelHeader.Height, null, true);
- });
- _panelContent.Width = this.ActualWidth;
- _panelContent.Height = this.ActualHeight;
- }
- }
- #endregion
- }
UWP 下拉刷新控件(PullToRefreshControl)的更多相关文章
- android官方下拉刷新控件SwipeRefreshLayout的使用
可能开发安卓的人大多数都用过很多下拉刷新的开源组件,但是今天用了官方v4支持包的SwipeRefreshLayout觉得效果也蛮不错的,特拿出来分享. 简介:SwipeRefreshLayout组件只 ...
- [Android]下拉刷新控件RefreshableView的实现
以下内容为原创,欢迎转载,转载请注明 来自天天博客:http://www.cnblogs.com/tiantianbyconan/p/4172483.html 需求:自定义一个ViewGroup,实现 ...
- android SwipeRefreshLayout google官方下拉刷新控件
下拉刷新功能之前一直使用的是XlistView很方便我前面的博客有介绍 SwipeRefreshLayout是google官方推出的下拉刷新控件使用方法也比较简单 今天就来使用下SwipeRefres ...
- Android PullToRefresh下拉刷新控件的简单使用
PullToRefresh这个开源库早就听说了,不过一直没用过.作为一个经典的的开源库,我觉得还是有必要认识一下. 打开github上的网址:https://github.com/chrisbanes ...
- Android SwipeRefreshLayout 官方下拉刷新控件介绍
转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/24521483 下面App基本都有下拉刷新的功能,以前基本都使用XListView ...
- Google SwipeRefreshLayout(Goolge官方下拉刷新控件)尝鲜
前天Google官方终于出了Android刷新控件——SwipeRefreshLayout. 使用前先需要将android.support.v4.jar升级到19.1.升级后,可能会出现SDK版本与A ...
- 上拉加载下拉刷新控件WaterRefreshLoadMoreView
上拉加载下拉刷新控件WaterRefreshLoadMoreView 效果: 源码: // // SRSlimeView // @author SR // Modified by JunHan on ...
- 官方下拉刷新控件SwipeRefreshLayout的使用
今天看博客,发现有了这个下拉刷新的控件,效果看上去还蛮好的,于是我也想研究的是使用一下,写个demo.其实使用很简单的,但就是为了能使用这个新组建我下了好久的更新,后来还是直接去官网下载最新的ADT得 ...
- Android仿苹果版QQ下拉刷新实现(一) ——打造简单平滑的通用下拉刷新控件
前言: 忙完了结婚乐APP的开发,终于可以花一定的时间放在博客上了.好了,废话不多说,今天我们要带来的效果是苹果版本的QQ下拉刷新.首先看一下目标效果以及demo效果: 因为此效果实现的步骤 ...
随机推荐
- Jquery 关于span标签的取值赋值用法
span是最简单的容器,可以当作一个形式标签,其取值赋值方法有别于一般的页面元素. //赋值 $("#spanid").html(value) //取值 $("#span ...
- Python【第一章】:简介和入门
ython简介 Python的创始人为Guido van Rossum.1989年圣诞节期间,在阿姆斯特丹,Guido为了打发圣诞节的无趣,决心开发一个新的脚本解释程序,做为ABC 语言的一种继承.之 ...
- 今天遇到sqlyog连接不上阿里云的数据库,最后百度解决了...
- Table
Table tb = new Table();TableRow r = new TableRow(); TableCell c = new TableCell();c.Text = "Sta ...
- 三、Shell变量类型和运算符
一.Shell变量的应用 1.Shell变量的种类 ·用户自定义变量:由用户自己定义.修改和使用 ·预定义变量:Bash预定义的特殊变量,不能直接修改 ·位置变量:通过命令行给 ...
- Python SMTP邮件模块
SMTP是发送邮件的协议,Python内置对SMTP的支持,可以发送纯文本邮件.HTML邮件以及带附件的邮件. Python对SMTP支持有smtplib和email两个模块,email负责构造邮件, ...
- 2012-2013 ACM-ICPC Northeastern European Regional Contest (NEERC 12)
Problems # Name A Addictive Bubbles1 addictive.in / addictive.out 2 s, 256 MB x438 B Blin ...
- javascript数据结构与算法--链表
链表与数组的区别? 1. 定义: 数组又叫做顺序表,顺序表是在内存中开辟一段连续的空间来存储数据,数组可以处理一组数据类型相同的数据,但不允许动态定义数组的大小,即在使用数组之前必须确定数组的大小. ...
- PHP正则表达式详解(二)
前言: 在本文中讲述了正则表达式中的组与向后引用,先前向后查看,条件测试,单词边界,选择符等表达式及例子,并分析了正则引擎在执行匹配时的内部机理. 本文是Jan Goyvaerts为RegexBudd ...
- Linux 新建用户、用户组,给用户分配权限(chown、useradd、groupadd、userdel、usermod、passwd、groupdel)
Linux 系统是一个多用户多任务的分时操作系统,任何一个要使用系统资源的用户,都必须首先向系统管理员申请一个账号,然后以这个账号的身份进入系统.用户的账号一方面可以帮助系统管理员对使用系统的用户进行 ...