Assalamualaikum ...
Pada kesempatan kali ini saya bisa berbagi lagi dengan tema Buat Layout Form Login Responsive Android Studio,kemaren sudah saya post tentang mempercantik button, dan cara ini hampir sama dalam pemanggilan source codenya dengan yang kemaren...
Dalam pembuatan Layout Form login ini teman - teman cuman main di folder Drawable Dengan activity_main.xml, jadi jangan kwatir saya disini mau berbagi tutorial full jadi teman teman bisa langsung ikuti langkah di bawah nati....
Langkah pertama buat project baru New Project_Next
Langkah ke dua kasih Nama project teman - teman, terserah teman teman mau ngasih nama aplikasi apa saja ...:D
Langkah ke tiga Pilih Device API 14, Recomended kalau saya pakek API 14, jadi untuk teman teman terserah mau pilih device API apa saja, sesuai kebutuhan suport API hp teman teman.
Langkah ke empat Create Layout Empty_Aktivity _Finish, Untuk buat percobaan awal Pilih Layout_Empty_Aktivity, lebih mudah untuk mendeklarasikan nantinya.....
Langkah ke lima buat Drawable page Klik kanan folder Drawable_Pilih New_Drawable resource file_Buat name diantara seperti dibawah ini
Source Code yang sudah teman - teman buat di folder drawable dengan name page bg_form.xml
Source Code yang sudah teman - teman buat di folder drawable dengan name page form.xml
Langkah selanjutnya teman - teman masuk activity_main.xml untuk meng oprek Layout Form Login, jadi saya disini mau berbagi source codenya, tinggal teman teman copy & paste Sorce codenya...:D
Demo Layout Form Login Responsive:
Hanya itu postingan hari ini semoga bermanfaat dan kelar berbagi tetap lillahitaala, dan apabila ada keluhan error bisa lansung contac di komentar atau bisa via email di bawah.....
Akhiron wassalamualaikum...
Pada kesempatan kali ini saya bisa berbagi lagi dengan tema Buat Layout Form Login Responsive Android Studio,kemaren sudah saya post tentang mempercantik button, dan cara ini hampir sama dalam pemanggilan source codenya dengan yang kemaren...
Dalam pembuatan Layout Form login ini teman - teman cuman main di folder Drawable Dengan activity_main.xml, jadi jangan kwatir saya disini mau berbagi tutorial full jadi teman teman bisa langsung ikuti langkah di bawah nati....
Langkah pertama buat project baru New Project_Next
Langkah ke dua kasih Nama project teman - teman, terserah teman teman mau ngasih nama aplikasi apa saja ...:D
Langkah ke tiga Pilih Device API 14, Recomended kalau saya pakek API 14, jadi untuk teman teman terserah mau pilih device API apa saja, sesuai kebutuhan suport API hp teman teman.
Langkah ke empat Create Layout Empty_Aktivity _Finish, Untuk buat percobaan awal Pilih Layout_Empty_Aktivity, lebih mudah untuk mendeklarasikan nantinya.....
Langkah ke lima buat Drawable page Klik kanan folder Drawable_Pilih New_Drawable resource file_Buat name diantara seperti dibawah ini
- button.xml
- bg_form.xml
- form.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<!--apply button background transparent, full opacity-->
<solid android:color="#3D9CD9" />
<!--make button border solid color, nontransparent-->
<stroke android:width="2dp"
android:color="#ffffff" />
<corners android:radius="25dp" />
</shape>
</item>
</selector>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<!--apply button background transparent, full opacity-->
<solid android:color="#3D9CD9" />
<!--make button border solid color, nontransparent-->
<stroke android:width="2dp"
android:color="#ffffff" />
<corners android:radius="25dp" />
</shape>
</item>
</selector>
Source Code yang sudah teman - teman buat di folder drawable dengan name page bg_form.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#F7F8F8" />
<corners android:radius="15dp" />
</shape>
</item>
</selector>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#F7F8F8" />
<corners android:radius="15dp" />
</shape>
</item>
</selector>
Source Code yang sudah teman - teman buat di folder drawable dengan name page form.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#ffffff" />
<corners android:radius="25dp" />
</shape>
</item>
</selector>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#ffffff" />
<corners android:radius="25dp" />
</shape>
</item>
</selector>
Langkah selanjutnya teman - teman masuk activity_main.xml untuk meng oprek Layout Form Login, jadi saya disini mau berbagi source codenya, tinggal teman teman copy & paste Sorce codenya...:D
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="280dp"
android:background="@color/colorPrimary">
<ImageView
android:id="@+id/logo"
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#009898"
android:layout_centerHorizontal="true"
android:layout_marginTop="16dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="@+id/logo"
android:text="SIGN IN"
android:textColor="#fff"
android:textSize="24sp"
android:layout_marginTop="16dp"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="-60dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_centerHorizontal="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingTop="16dp"
android:background="@drawable/bg_form">
<EditText
android:id="@+id/username"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:hint="Username"
android:background="@drawable/form"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="8dp"
android:paddingBottom="8dp"/>
<EditText
android:id="@+id/password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:hint="Password"
android:background="@drawable/form"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:layout_marginTop="16dp"
android:layout_marginBottom="50dp"/>
</LinearLayout>
<Button
android:id="@+id/btn_login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/button"
android:clickable="true"
android:focusable="true"
android:layout_marginTop="-25dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:text="SIGN IN"
android:textColor="#fff"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="8dp"
android:textColor="#000"
android:layout_marginTop="16dp"
android:text="Forgot Password"/>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="280dp"
android:background="@color/colorPrimary">
<ImageView
android:id="@+id/logo"
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#009898"
android:layout_centerHorizontal="true"
android:layout_marginTop="16dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="@+id/logo"
android:text="SIGN IN"
android:textColor="#fff"
android:textSize="24sp"
android:layout_marginTop="16dp"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="-60dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_centerHorizontal="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingTop="16dp"
android:background="@drawable/bg_form">
<EditText
android:id="@+id/username"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:hint="Username"
android:background="@drawable/form"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="8dp"
android:paddingBottom="8dp"/>
<EditText
android:id="@+id/password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:hint="Password"
android:background="@drawable/form"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:layout_marginTop="16dp"
android:layout_marginBottom="50dp"/>
</LinearLayout>
<Button
android:id="@+id/btn_login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/button"
android:clickable="true"
android:focusable="true"
android:layout_marginTop="-25dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:text="SIGN IN"
android:textColor="#fff"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="8dp"
android:textColor="#000"
android:layout_marginTop="16dp"
android:text="Forgot Password"/>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
Demo Layout Form Login Responsive:
Hanya itu postingan hari ini semoga bermanfaat dan kelar berbagi tetap lillahitaala, dan apabila ada keluhan error bisa lansung contac di komentar atau bisa via email di bawah.....
Akhiron wassalamualaikum...
Post a Comment