如何做WP的登录/注册功能

首先我要做的效果如下

如何做WP的登录/注册功能_第1张图片

 

思路一:page

在WP里Page是最基本的东西,你第一想法肯定是用Page来做登录注册。但是登录注册其实是不太适合用Page来做,关于login screen/splash screen的分析,且看这篇著名博文Introducing the concept of “Places”,在看完后想想用popup来做.登录注册页面在很多地方会被调用到,使用page会导致页面间跳转逻辑比较乱。

 

思路二:popup

popup只是个容器,设置Child为什么都可以,然后IsOpen=true;就显示出来了。

问题一:popup的Child可以是page吗?

答案是可以的。

signInUpPopup = new Popup();
//SignInUp为Page,改造过了
Guanjia.Views.SignInUp signInUp = new Guanjia.Views.SignInUp(this, signInUpPopup, 480, 728, 0);//this);
//这个不用解释了
signInUpPopup.Child = signInUp;
signInUpPopup.IsOpen = true;

然后更多问题出来了。

问题二:

当按下BackKey键的时候,Popup出来的页面连同父Page全部关掉了,不是我们期望的Popup消失的效果。所以要处理下。

private void doSignInUp()
        {
            signInUpPopup = new Popup();
            //SignInUp为Page,改造过了
            Guanjia.Views.SignInUp signInUp = new Guanjia.Views.SignInUp(this, signInUpPopup, 480, 728, 0);//this);
            //登录注册成功后回调了
            signInUp.OnSuccess += new EventHandler(signInUp_OnSuccess);
            //这个不用解释了
            signInUpPopup.Child = signInUp;
            //一下三行处理BackKey冲突
            signInUpPopup.Loaded += new RoutedEventHandler(signInUpPopup_Loaded);
            signInUpPopup.Unloaded += new RoutedEventHandler(signInUpPopup_Unloaded);
            signInUpPopup.Closed += new EventHandler(signInUpPopup_Closed);
            signInUpPopup.IsOpen = true;
        }

        void signInUpPopup_Unloaded(object sender, RoutedEventArgs e)
        {
            //草草草 没被调用
            Debug.WriteLine("Popup Unloaded here");
            this.BackKeyPress += Main_BackKeyPress;
        }

        public void AddBackKeyPressHandle()
        {
            this.BackKeyPress += Main_BackKeyPress;
        }

        void signInUpPopup_Loaded(object sender, RoutedEventArgs e)
        {
            this.BackKeyPress -= Main_BackKeyPress;
        }

        void signInUpPopup_Closed(object sender, EventArgs e)
        {
            Debug.WriteLine("Popup closed here");
            this.BackKeyPress += Main_BackKeyPress;
        }

        void signInUpPopup_Opened(object sender, EventArgs e)
        {
            this.BackKeyPress -= Main_BackKeyPress;
        }

问题三:Popup出来的Page的ApplicationBar不对(在父Page里我没设ApplicationBar,所以popup出来也没有 ApplicationBar),popup出来的page可以有ApplicationBar吗?我跑到stackoverflow一问: Is it possible to popup a sigin/up page(pivot) with appbar?。得到答案可以。

以下为改造过的登录页面

public partial class SignInUp : PhoneApplicationPage
    {
        private PhoneApplicationPage page = null;
        private IApplicationBar parentAppBar = null;
        private Popup popup = null;

        //public static event EventHandler OnSuccess;

        public SignInUp()
        {
            InitializeComponent();
            page = this;
        }

        public SignInUp(PhoneApplicationPage parentpage, Popup popup, int width, int height, int selectedIndex = 0)
        {
            InitializeComponent();
            page = parentpage;
            this.popup = popup;
            this.Height = height;
            this.Width = width;
            //SignInUpPivot.SelectedIndex = selectedIndex;
            parentAppBar = parentpage.ApplicationBar;
            this.Loaded += (s, e) =>
                {
                    page.BackKeyPress += page_BackKeyPress;
                };
            this.Unloaded += (s, e) =>
                {
                    page.ApplicationBar = parentAppBar;
                    page.BackKeyPress -= page_BackKeyPress;
                };
        }

        void page_BackKeyPress(object sender, System.ComponentModel.CancelEventArgs e)
        {
            popup.IsOpen = false;
            e.Cancel = true;
        }
private void Pivot_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            int selectedIndex = (sender as Pivot).SelectedIndex;
            if (selectedIndex == 0)
            {
                page.ApplicationBar = (Microsoft.Phone.Shell.ApplicationBar)Resources["SignInAppbar"];
            }
            else if (selectedIndex == 1)
            {
                page.ApplicationBar = (Microsoft.Phone.Shell.ApplicationBar)Resources["SignUpAppbar"];
            }
        }

问题4:无法使用Code4Fun toolkit里的ToastPrompt来进行提示。网上一搜,c4f的开发者说ToastPrompt是所在层级与popup不一样(在popup之下,page之上),看了一下源码它使用了自己实现的popup来实现ToastPrompt。把c4f里的ToastPrompt改造成使用的Popup来实现,效果不好,但总算能显示在弹出来的东西之上,效果不好。

问题5:注册页里的TextBox会被弹出来的键盘遮住,不能像page那样自动向上移动。同样有人问了这样的问题:

http://webcache.googleusercontent.com/search?q=cache:aGfMs1FXRZcJ:forums.create.msdn.com/forums/t/74943.aspx+wp7+textbox+in+popup+keyboard&cd=5&hl=zh-TW&ct=clnk&gl=hk

这个真心没找到解决方案。

可见Popup来实现缺点太多。

 

思路三:还是用Page,只有一个问题:如何在登录成功后执行/通知前一个页面,执行一些操作,更新UI等?

解决方法:

1在SignInUp页里加一个可以登录注册成功事件,以便前一个页面添加回调

public partial class SignInUp : PhoneApplicationPage
    {
        //回调
        public static event EventHandler OnSuccess;

        public SignInUp()
        {
            InitializeComponent();
        }

2登录注册成功后调用OnSuccess

 

XXXService.Login(username, password, delegate(int loginResult)
            {
                switch (loginResult)
                {
                    case 1:
                        //登录成功
                        //Main.ToastMessage = "登录成功";
                        App.CurrentAccount = new Account
                        {
                            Username = username,
                            Password = password,
                        };
                        if (AutoSignInCheckBox.IsChecked == true)
                        {
                            GuanjiaPersistentUserDatas.Account = App.CurrentAccount;
                        }
                       //调用回调
                        if (OnSuccess != null)
                        {
                            OnSuccess(null, null);
                        }

                        this.NavigationService.GoBack();
                        

                        //do something here
                        break;
                    case -1:
                        ToastHelper.GetBasicToast("用户密码错误", "登录失败").Show();
                        break;
                    case -2:
                        ToastHelper.GetBasicToast("用户不存在", "登录失败").Show();
                        break;
                    default:
                        break;
                }
            },

 3在父页面中只需在navigation到SignInUp.xaml前多一个步骤

        private void doSignInUp()
        {
            SignInUp.OnSuccess += new EventHandler(signInUp_OnSuccess);
            NavigationService.Navigate(new Uri("/Views/SignInUp.xaml?Action=SignIn", UriKind.Relative));
        }

 DONE!

你可能感兴趣的:(Windows+Phone)