Post
Ask Question

Xamarin Android: Create Android TextInputLayout And Spinner

Let’s start,

Step 1: Open Visual Studio->New Project->Templates->Visual C#->Android->Blank app

Select blank app. Give the Project Name and Project Location.

Step 2: Go to Solution Explorer-> Project Name-> Components, right click to get more components, open new dialog box. This dialog box is required to search the design, add the Android Support Design Library Packages.

Step 3: Next to Add Theme.AppCompat.Light.NoActionBar, create styles.xml file. Go to Solution Explorer-> Project Name->Resources->values, right click to Add-> New Item, open new dialog box. Select XML file and give the name for styles.xml,



Step 4: Create colors.xml file. Go to Solution Explorer-> Project Name->Resources->values, right click to Add-> New Item, open new dialog box. Select XML file, give the name for colors.xml.



Step 5: Open Solution Explorer-> Project Name->Resources->values->colors.xml. Click to open Design View and the code, given below:

  1. <?xml version="1.0" encoding="utf-8" ?>  
  2. <resources>  
  3.     <color name="window_background">#8AA5B9</color>  
  4. </resources>  

Step 6: Open Solution Explorer-> Project Name->Resources->values->styles.xml. Click to open Design View and the code, given below:

  1. <?xml version="1.0" encoding="utf-8" ?>  
  2. <resources>  
  3.     <style name="Theme.DesignDemo" parent="Base.Theme.DesignDemo">  
  4.   
  5.     </style>  
  6.     <style name="Base.Theme.DesignDemo" parent="Theme.AppCompat.Light.NoActionBar">  
  7.         <item name="colorPrimary">#2196F3</item> <item name="colorPrimaryDark">#1976D2</item> <item name="android:windowBackground">@color/window_background</item>  
  8.     </style>  
  9. </resources>  

Step 7: Open Solution Explorer-> Project Name->Resources->values->Strings.xml. Click to open Design View and the code, given below:

  1. <string name="pro_Languages1">Type of Languages</string>  
  2. <string-array name="pro_Languages">  
  3.     <item>C#</item>  
  4.     <item>.Net</item>  
  5.     <item>Java</item>  
  6.     <item>C</item>  
  7.     <item>C++</item>  
  8.     <item>Swift</item>  
  9. </string-array>  
  10. </resources>  

Step 8: Open Solution Explorer-> Project Name->Resources->layout ->Main.axml. Click to open Design View and the code, given below:

 

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent">  
  3.     <LinearLayout android:orientation="vertical" android:layout_marginTop="80dp" android:layout_width="match_parent" android:layout_height="wrap_content">  
  4.         <android.support.design.widget.TextInputLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:id="@+id/textuernameInputLayout">  
  5.             <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/txtusername" android:hint="User Name" android:singleLine="true" /> </android.support.design.widget.TextInputLayout>  
  6.         <android.support.design.widget.TextInputLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:id="@+id/textpasswordInputLayout">  
  7.             <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/txtpassword" android:inputType="textPassword" android:hint="Password" android:singleLine="true" /> </android.support.design.widget.TextInputLayout>  
  8.         <Spinner android:id="@+id/ddlmechservicetype" android:layout_width="fill_parent" android:layout_height="wrap_content" />  
  9.         <Button android:text="Click" android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/btnclick" /> </LinearLayout>  
  10. </LinearLayout>  

Step 9: After Design view creation open Solution Explorer-> Project Name->MainActivity.cs then following below steps.

Step 10: Add below Namespaces,

  1. using Android.Support.V7.App;    
  2. using Android.Support.Design.Widget;  

Step 11: Create Spinner and TextInputLayout variable, declare the Spinner and TextInputLayout within the OnCreate().before to change to the Activity to AppCompatActivity.

  1. //TextInputLayout  
  2. TextInputLayout txtlayoutusername = FindViewById < TextInputLayout > (Resource.Id.textuernameInputLayout);  
  3. TextInputLayout textpasswordInputLayout = FindViewById < TextInputLayout > (Resource.Id.textpasswordInputLayout);  
  4. EditText txtusername = FindViewById < EditText > (Resource.Id.txtusername);  
  5. EditText txtpassword = FindViewById < EditText > (Resource.Id.txtpassword);  
  6. Button btnclick = FindViewById < Button > (Resource.Id.btnclick);  
  7. //Spinner  
  8. spinner = FindViewById < Spinner > (Resource.Id.ddlmechservicetype);  
  9. var adapter = ArrayAdapter.CreateFromResource(this, Resource.Array.pro_Languages, Android.Resource.Layout.SimpleSpinnerItem); //Assign Array List Strings  
  10. adapter.SetDropDownViewResource(Android.Resource.Layout.SimpleSpinnerDropDownItem);  
  11. spinner.Adapter = adapter;  
  12. //Button Click  
  13. btnclick.Click += (sender, e) =>  
  14. {  
  15.     //Showing Notifications  
  16.     Toast.MakeText(this, txtusername.Text, ToastLength.Short).Show();  
  17.     Toast.MakeText(this, txtpassword.Text, ToastLength.Short).Show();  
  18.     Toast.MakeText(this, spinner.SelectedItemPosition.ToString(), ToastLength.Short).Show();  
  19. };  

Step 12: Press F5 or build and run the Application. 

Finally, we successfully created Xamarin Android TextInputLayout and Spinner app.


Similar Articles