Xamarin-多屏应用 - 芒果文档

📌 相关文章

📜 Xamarin-多屏应用

📅 最后修改于: 2020-12-07 05:08:23 🧑 作者: Mango

在本章中，我们将创建一个使用户能够注册的登录系统。然后，成功登录后，我们会将注册用户带到我们应用的主屏幕。

首先，创建一个新项目并将其命名为Login System 。在新项目上，转到main.axml并添加两个按钮和一个进度栏，如下所示。

创建用户界面之后，对按钮进行样式设置以使其看起来更具吸引力很重要。为此，请在drawable文件夹下创建一个新的XML文件，并将其命名为btnSignInStyle.xml 。

在XML文件中，添加以下代码行-

上面的代码设置了加载和单击时按钮的颜色，还设置了按钮的边框半径。

接下来，我们为注册按钮创建与上面类似的样式XML。为此，请在drawable文件夹下创建另一个XML，并将其命名为btnSignUpStyle.xml 。它将继承btnSignInStyle.xml的所有内容。唯一的区别是按钮的渐变开始和结束颜色。

更改startColor和ENDCOLOR在btnSignUpStyle.xml到

转到布局文件夹并创建一个新的AXML文件，并将其命名为registerDailog.axml。该文件将包含我们应用中新用户的注册详细信息。该页面将包含三个EditTexts和一个提交数据的按钮。在线性布局代码中添加以下代码。

接下来，添加一个名为signUpDialog.cs的新类。此类将包含创建对话框所需的代码。以下示例显示了代码。

public class OnSignUpEvent:EventArgs { 
   private string myUserName; 
   private string myEmail; 
   private string myPassword; 
   public string UserName { 
      get { 
         return myUserName; 
      } 
      set{ 
         myUserName = value;
      } 
   } 
      
   public string Email { 
      get { 
         return myEmail; 
      } 
      set { 
         myEmail = value; 
      } 
   } 
      
   public string Password { 
      get { 
         return myPassword; 
      } 
      set { 
         myPassword = value; 
      } 
   }  
   public OnSignUpEvent(string username, string 
      email, string password):base() { 
      UserName = username; 
      Email = email; 
      Password = password; 
   } 
     
   class SignUpDialog:DialogFragment { 
      private EditText txtUsername; 
      private EditText txtEmail; 
      private EditText txtPassword; 
      private Button btnSaveSignUp; 
      public event EventHandler onSignUpComplete; 
      public override View OnCreateView(LayoutInflater inflater, 
         ViewGroup container, Bundle savedInstanceState) { 
         base.OnCreateView(inflater, container, savedInstanceState);       
         var view = inflater.Inflate(Resource.Layout.registerDialog, container, false); 
         txtUsername = view.FindViewById(Resource.Id.txtUsername); 
         txtEmail = view.FindViewById(Resource.Id.txtEmail); 
         txtPassword = view.FindViewById(Resource.Id.txtPassword);
         btnSaveSignUp = view.FindViewById

在上面的代码中，我们使用了get和set属性。 get方法返回一个变量，而set方法将一个值分配给返回的变量。这是一个例子-

public string Color { 
   get { 
      return color;  
   } 
   set { 
      color = value;  
   } 
}

在前面的示例中，我们创建了一个覆盖视图的方法。里面的方法，我们创建了包含在布局文件夹中的registerDialog.axml引用的变种称为视图。

接下来，转到mainActivity.cs以创建对话框片段。

private Button signUp; 
private Button submitNewUser; 
private EditText txtUsername; 
private EditText txtEmail; 
private EditText txtPassword; 

protected override void OnCreate(Bundle bundle) { 
   base.OnCreate(bundle);  
   SetContentView(Resource.Layout.Main);
   signUp = FindViewById

上面的代码包含一个按钮单击事件，单击该事件会加载注册对话框。在单击按钮内，我们创建了一个SignUpDialog类，该类加载registerDialog.axml文件。

然后，我们使用FragmentTransaction transFrag = FragmentManager.BeginTransaction();将我们的registerDialog页面显示为Android Dialog Fragment。

我们将添加另一个名为home.axml的.axml文件。用户成功登录系统后，此布局将成为登录屏幕。在此布局内，我们将添加一个文本视图，如以下代码所示。

接下来，我们创建一个名为Activity2.cs的最终活动。在本活动中，我们将使用findViewById查找home.axml 。

最后，构建并运行您的App。它将显示以下屏幕作为输出。

建立应用程式