登錄界面設計

一.準備登錄界面圖片素材(透明背景圖片)
1.把準備好的圖片放在Images 文件夾下面,格式分別是.png和.ico

2.選中 login.png圖片鼠標右鍵,選擇屬性。生成的操作選擇==>資源

3.MyTodo 應用程序右鍵,屬性,設置窗口圖標

二.開始創建編寫登錄界面
1.添加用戶控件,創建一個名為?LoginView.xaml 登錄界面視圖,并編寫登錄界面

<UserControl x:Class="MyToDo.Views.Dialog.LoginView"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:local="clr-namespace:MyToDo.Views.Dialog"xmlns:md="http://materialdesigninxaml.net/winfx/xaml/themes"xmlns:prism="http://prismlibrary.com/"mc:Ignorable="d" Height="350" Width="600"><!--修改外觀樣式--><prism:Dialog.WindowStyle><Style TargetType="Window"><Setter Property="Width" Value="600"/><Setter Property="Height" Value="350"/><Setter Property="SizeToContent" Value="WidthAndHeight"/> <!--當前窗口大小--><Setter Property="ResizeMode" Value="NoResize"/> <!--不允許調整窗口大小--><Setter Property="prism:Dialog.WindowStartupLocation" Value="CenterScreen"/> <!--窗口啟動位置--></Style></prism:Dialog.WindowStyle><Grid Background="White"><!--界面分左右兩列--><Grid.ColumnDefinitions><ColumnDefinition Width="1.5*"/><ColumnDefinition/></Grid.ColumnDefinitions><Image Source="/Images/login.png" Margin="50"/><DockPanel Grid.Column="1" VerticalAlignment="Center" Margin="15"><TextBlock Text="歡迎使用" FontSize="22" FontWeight="Bold" Margin="0,10" DockPanel.Dock="Top"/><TextBox Margin="0,10" md:HintAssist.Hint="請輸入賬號" DockPanel.Dock="Top"/><PasswordBox Margin="0,10" md:HintAssist.Hint="請輸入密碼" DockPanel.Dock="Top"/><Button Content="登錄系統" DockPanel.Dock="Top"/><DockPanel LastChildFill="False" Margin="0,10"><TextBlock Text="注冊賬戶"/><TextBlock Text="忘記密碼?" DockPanel.Dock="Right"/></DockPanel></DockPanel></Grid>
</UserControl>
?2.添加登錄界面對應的后臺邏輯處理類?LoginViewModel
public class LoginViewModel : BindableBase, IDialogAware
{public string Title { get; set; } = "ToDo"; //設置窗口標題public event Action<IDialogResult> RequestClose;public bool CanCloseDialog(){return true;}public void OnDialogClosed(){}public void OnDialogOpened(IDialogParameters parameters){}
}
三.應用程序啟動的時候,先彈出登錄界面。登錄成功后再跳轉內容主頁
?1.首先在應用程序啟動初始化的過程中,進行判斷。拿到彈窗的對話服務。

四.最后,把登錄界面注冊到容器中
containerRegistry.RegisterDialog<LoginView, LoginViewModel>();

public partial class App : PrismApplication{/// <summary>/// 創建啟動頁面/// </summary>/// <returns></returns>protected override Window CreateShell(){return Container.Resolve<MainView>();}protected override void OnInitialized(){var dialog= Container.Resolve<IDialogService>();//取到對話框服務//彈出登錄界面dialog.ShowDialog("LoginView", callback =>{if (callback.Result == ButtonResult.None){Application.Current.Shutdown();//關閉當前應用程序return;}var service = App.Current.MainWindow.DataContext as IConfigureService;if (service != null) service.Configure();base.OnInitialized();});}/// <summary>/// 依懶注入的方法/// </summary>/// <param name="containerRegistry"></param>protected override void RegisterTypes(IContainerRegistry containerRegistry){//對封裝的http請求類,進行注入。并且設置一個默認參數containerRegistry.GetContainer().Register<HttpRestClient>(made:Parameters.Of.Type<string>(serviceKey:"webUrl"));//注冊默認的服務地址containerRegistry.GetContainer().RegisterInstance(@"http://localhost:5143/",serviceKey: "webUrl");//注冊服務containerRegistry.Register<IToDoService, ToDoService>();containerRegistry.Register<IMemoService, MemoService>();containerRegistry.Register<IDialogHostService, DialogHostService>();//注冊彈窗containerRegistry.RegisterDialog<LoginView, LoginViewModel>();containerRegistry.RegisterForNavigation<AddToDoView, AddToDoViewModel>();containerRegistry.RegisterForNavigation<AddMemoView, AddMemoViewModel>();containerRegistry.RegisterForNavigation<AboutView>();containerRegistry.RegisterForNavigation<MsgView,MsgViewModel>();containerRegistry.RegisterForNavigation<SkinView, SkinViewModel>();containerRegistry.RegisterForNavigation<IndexView, IndexViewModel>();containerRegistry.RegisterForNavigation<MemoView, MemoViewModel>();containerRegistry.RegisterForNavigation<ToDoView, ToDoViewModel>();containerRegistry.RegisterForNavigation<SettingsView, SettingsViewModel>();}}