2013年4月23日 星期二

[Windows 8] How to create a login screen in Windows Store App by C#


Today, I will show you how to create a login screen in Windows Style Application by C#.

The result in the following shown:
Firstly, create the xaml page and add the codes:

<Page x:Class="FacebookDemo.FacebookLogin" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:FacebookDemo" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d">

    <ContentControl x:Name="container" Height="450" Margin="0,194,0,124">
        <Popup x:Name="logincontrol" IsOpen="False" >
           <StackPanel Orientation="Vertical" Background="#3F000000" Height="400" x:Name="pop" > 
               <WebView Name="WebView" Width="450" Height="400" Loaded="WebView_Loaded" /> 
           </StackPanel>
        </Popup>
    </ContentControl>
</Page>

and then add the codes into xaml.cs construct:
namespace FacebookDemo
{
    public sealed partial class FacebookLogin : Page
    {
 ...
        public FacebookLogin()
        {
     ... 
            this.InitializeComponent();

            container.IsEnabled = true;
            logincontrol.IsOpen = true;
            pop.Width = Window.Current.Bounds.Width;
        }
 ...
    }
}

Secondly, I add the codes to show popup windows in the main page:
namespace FacebookDemo
{
    ...
    public sealed partial class MainPage : FacebookDemo.Common.LayoutAwarePage
    {
 ...
        Popup popup = new Popup();
        public MainPage()
        {
            this.InitializeComponent();
            popup.Child = new FacebookLogin();
            popup.VerticalOffset = 0;
            popup.HorizontalOffset = 0;
            popup.Width = Window.Current.Bounds.Width;
            popup.Height = Window.Current.Bounds.Height;

            popup.IsOpen = true;
            IsEnabled = false;
            App.fbevents.FBEvent += fbevents_FBEvent;
     ...
        }
        ...
        void fbevents_FBEvent(object sender, string accesscode)
        {
            IsEnabled = true;
            ...
        }
    }
}

When the popup windows is shown, the main page should set IsEnable to false. When the popup windows is closed, the main page must set  IsEnable to true.

沒有留言:

張貼留言