Showing posts with label dialog box in monoandroid. Show all posts
Showing posts with label dialog box in monoandroid. Show all posts

Saturday 25 October 2014

How to use Login Dialog Box in Android Mono C#


For This small demo project we require the following file structure

Main.axml file that contains code for hello world button on which we place button that will further generate the Dialog Box for Login Activity

Main.cs file Now this file will contain the code for Main.axml actions and events

Login.axml file that will contain the code that will contain the style or pattern how the login dialog will look all .axml design code for login form will reside here


AXML Code For Login  Dialog Box  ( login .axml ) file code

Design Look -





It is a simple code that contains a linear layout that will place all controls in linear order as they are placed in it Then we have placed two Edittext for allowing the user to enter username in first and Password in second . Then we have placed two buttons One for login and second for cancellation of login .

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_height="match_parent"
    android:paddingLeft="10dp"
    android:paddingRight="10dp"
    android:background="#fff"
    android:layout_width="300dp"
    android:paddingTop="10dp">
    <EditText
        android:layout_height="wrap_content"
        android:id="@+id/txtUsername"
        android:layout_width="match_parent">
        <requestFocus />
    </EditText>
    <EditText
        android:layout_height="wrap_content"
        android:inputType="textPassword"
        android:id="@+id/txtPassword"
        android:layout_width="match_parent" />
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/linearLayout1">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="0.5"
            android:id="@+id/btnLogin"
            android:text="Login" />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="0.5"
            android:id="@+id/btnCancel"
            android:text="Cancel" />
    </LinearLayout>
</LinearLayout>

XAML code for Main .axml file 

Design Look -




<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_height="match_parent"
    android:paddingLeft="10dp"
    android:paddingRight="10dp"
    android:background="#fff"
    android:layout_width="300dp"
    android:paddingTop="10dp">
 
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="0.5"
            android:id="@+id/hello"
            android:text="Hello world!" />
 
</LinearLayout>


C# Code for Main.cs file 


 protected override void OnCreate(Bundle bundle)
{
 base.OnCreate(bundle);
 SetContentView(Resource.Layout.Main);
 TextView hellobtn = FindViewById<TextView>(Resource.Id.hello);
 hellobtn.Click += btnclick;
}

void btnclick(object sender, EventArgs e)
        {

            Dialog login = new Dialog(this);
            login.SetContentView(Resource.Layout.login);
            login.Show();
}

Explanation of Code 

PART I

protected override void OnCreate(Bundle bundle)
{
 base.OnCreate(bundle);
 SetContentView(Resource.Layout.Main);
 TextView hellobtn = FindViewById<TextView>(Resource.Id.hello);
 hellobtn.Click += loginclick;
}

In above code First i have used OnCreate Method that is startup method when an android application starts it first load up everything in OnCreate Method and Create their space in memory

SetContentView(Resource.Layout.Main);

Then at this line i have set what layout will this code is meant for I have choosen Main layout in Resource folder whose design preview is shown in images above

 Button loginbtn = FindViewById<Button>(Resource.Id.btnLogin);

Then at this line i have made instance of button and set that textview to the hello world button that i have placed on Main form I have used FindviewById method to find the button and then assign that button to hellobtn

Then at this line i have assigned click event to button by using following line of code

 hellobtn.Click += btnclick;

Then i have given definition to btnclick funtion in code below

PART I

void btnclick(object sender, EventArgs e)
        {

            Dialog login = new Dialog(this);
            login.SetContentView(Resource.Layout.login);
            login.Show();
}

In this code i have made Instance of Dialog class for showing dialog box on screen i have created new class instance then i have set what view will be shown on dialog that is going to appear i have set the view contentview to login.axml content view that i have designed earlier in this article then i have used show( ) function to show login dialog box