标签:
【本系列需要具有一定开发基础】
我们在开发中经常遇到这样的场景:
1.呈现详细信息,且包含一些操作。如:查看原图,支持放大,缩小,多图。
2.执行特定的行为,且要有回执结果。如:选择联系人,选中某图,用户登录。
普遍的解决方案就是封装一个UserControl放到页面里,控制其显隐性。如果功能很少,那无所谓,可稍微复杂一点的,封装成单独的一个页面不是更好吗?还能节省当前页面的资源。此方法能够解决场景1,但是场景2需要回执结果,又该怎么办,总不能用全局变量吧。PageUserControl就是主要解决这些问题而封装,它将包含特定逻辑的页面封装成伪控件,使其可以单独调用,且可以反馈执行结果。
调用方法如图:
PageUserControl
PageUserControl是一个抽象的泛型类,作为封装控件的父类。原理:监听Frame的Navigated事件,利用缓存的两个页面变量,区别出是Forward还是Back,然后分别做传值和取值操作。废话不多说,直接上代码:
public abstract class PageUserControl<TPage> where TPage : Page { private const string _FrameNameInFramePage = "childrenFrame"; private Frame _frame; private object _frameContentWhenOpened; private TPage _page; /// <summary> /// 获取是否优先呈现在ChildrenFrame中。 /// </summary> public bool IsChildrenFrameFirst { get; protected set; } #region Methods protected void ShowPage() { this.OpenPickerPage(); } protected void ShowPage(object parameter) { this.OpenPickerPage(parameter); } //若需向调用者返回某值,则需要实现此方法。 protected virtual void CommitValue(TPage page) { } private void OpenPickerPage(object parameter = null) { if (null == _frame) { _frame = Window.Current.Content as Frame; if (null != _frame) { //这里是约定MainPage页中childrenFrame是子Frame。 //此方法并非绝对,仍有很多灵活的方法可以扩展,比如附加属性来指定谁是ChildrenFrame。 if (this.IsChildrenFrameFirst && this._frame.CurrentSourcePageType.Equals(typeof(Pages.MainPage))) { var framePage = (Pages.MainPage)_frame.Content; var frameInFramePage = framePage.FindName(_FrameNameInFramePage) as Frame; if (frameInFramePage != null) { this._frame = frameInFramePage; } } _frameContentWhenOpened = _frame.Content; _frame.Navigated += OnFrameNavigated; _frame.NavigationStopped += OnFrameNavigationStopped; _frame.NavigationFailed += OnFrameNavigationFailed; if (parameter == null) { _frame.Navigate(typeof(TPage)); } else { _frame.Navigate(typeof(TPage), parameter); } } } } private void ClosePickerPage() { // 注销事件 if (null != _frame) { _frame.Navigated -= OnFrameNavigated; _frame.NavigationStopped -= OnFrameNavigationStopped; _frame.NavigationFailed -= OnFrameNavigationFailed; _frame = null; _frameContentWhenOpened = null; } //若缓存页面有值,则尝试做提交处理。 if (null != this._page) { this.CommitValue(this._page); this._page = null; } } #endregion #region Events private void OnFrameNavigated(object sender, NavigationEventArgs e) { //若是Back则做关闭处理,若是Forward则把新页缓存。 if (e.Content == _frameContentWhenOpened) { ClosePickerPage(); } else if (null == this._page) { var page = e.Content as TPage; if (page != null) { this._page = page; } } } private void OnFrameNavigationFailed(object sender, NavigationFailedEventArgs e) { ClosePickerPage(); } private void OnFrameNavigationStopped(object sender, NavigationEventArgs e) { ClosePickerPage(); } #endregion }
以上的代码对Frame做了简单扩展,使其能支持在子Frame中呈现(主要是考虑到UWP的SpiltView),但是采用的固定约束,并不灵活。各位看官可以自行扩展,比如:使用附加属性来标识某一个Frame,这里就不实现了。
public class ImageChooser : PageUserControl<ImageChooserPage> { public ImageChooser() { //优先在ChildrenFrame呈现。 base.IsChildrenFrameFirst = true; } public void Show() { base.ShowPage(); } protected override void CommitValue(ImageChooserPage page) { base.CommitValue(page); //若标识结果的页面属性值有效,则通过事件抛给调用者。 if (!string.IsNullOrWhiteSpace(page.Value)) { this.OnCompleted(page.Value); } } public event EventHandler<ChooseImageCompletedEventArgs> Completed; private void OnCompleted(string image) { var handler = this.Completed; if (handler != null) { handler(this, new ChooseImageCompletedEventArgs(image)); } } } public class ChooseImageCompletedEventArgs : EventArgs { public string Image { get; private set; } internal ChooseImageCompletedEventArgs(string image) { this.Image = image; } }
以上代码是针对需要返回值的场景,如果无须返回值则留空或者不重写CommitValue方法即可。
public HomePage() { this.InitializeComponent(); this.NavigationCacheMode = NavigationCacheMode.Required; } protected override void OnNavigatedFrom(NavigationEventArgs e) { base.OnNavigatedFrom(e); if (e.NavigationMode == NavigationMode.Back) { this.NavigationCacheMode = NavigationCacheMode.Disabled; } }
如何正确应用在MVVM模式中?使用Behavior!
<Button Content="图片" Grid.Row="1"> <i:Interaction.Behaviors> <core:EventTriggerBehavior EventName="Click"> <behaviors:ShowListPickerAction ItemsSource="{Binding Images}" ItemTemplate="{ThemeResource ImageItemTemplate}" ItemsPickedCommand="{Binding ImagePickedCommand}" ItemsPickedInputConverter="{StaticResource ListPickerItemsPickedEventArgsConverter}"/> </core:EventTriggerBehavior> </i:Interaction.Behaviors> </Button>
转载请注明出处。
Windows 10(UWP)开发技巧 - PageUserControl
标签:
原文地址:http://www.cnblogs.com/roler/p/4816473.html