Free Android Form Designs with XML Code

Published by Kapil Mohan on

Free form design inspirations for android, with full source code

Free android form design with source code - preview

Needs to include Apptheme.NoActionbar as theme in activity, along with android: label

 <activity android:name=".MainActivity"
            android:label="@string/app_name"
            android:theme="@style/AppTheme.NoActionBar"/>

Gradle:

Requires support, design, card view and constraint libraries. If already present, ignore this step.

dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation 'com.android.support:appcompat-v7:27.1.1'
    implementation 'com.android.support:design:27.1.1'
    implementation 'com.android.support:support-v4:27.1.1'
    implementation 'com.android.support:cardview-v7:27.1.1'
    implementation 'com.android.support.constraint:constraint-layout:1.1.3'
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'com.android.support.test:runner:1.0.2'
    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
}

Includes main and content layout files.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true"
    tools:context="com.appsnipp.formdesigns.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="@dimen/form_app_bar_height"
        android:fitsSystemWindows="true"
        android:theme="@style/AppTheme.AppBarOverlay"
        android:background="@drawable/centre_background">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/toolbar_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/centre_background">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentEnd="true"
                    android:layout_alignParentRight="true"
                    android:layout_alignParentBottom="true"
                    android:layout_marginTop="10dp"
                    android:adjustViewBounds="true"
                    android:cropToPadding="true"
                    android:src="@drawable/enquiry_bk" />

            </RelativeLayout>

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/AppTheme.PopupOverlay" />

        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>

    <include layout="@layout/content_main" />

</android.support.design.widget.CoordinatorLayout>

content_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView 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:id="@+id/scrollFeed"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.appsnipp.formdesigns.MainActivity"
    tools:showIn="@layout/activity_main"
    android:background="@drawable/centre_background"
    android:focusableInTouchMode="true">

    <android.support.v7.widget.CardView
        android:id="@+id/personalDetailsCard"
        style="@style/centreLocatorCardDesign"
        android:layout_marginTop="10dp"
        app:cardCornerRadius="16dp"
        app:cardElevation="10dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:focusableInTouchMode="false"
            android:orientation="vertical"
            android:padding="20dp">

            <android.support.design.widget.TextInputLayout
                android:id="@+id/txtInputName"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <EditText
                    android:id="@+id/txtName"
                    style="@style/modifiedEditText"
                    android:hint="@string/name"
                    android:singleLine="true" />

            </android.support.design.widget.TextInputLayout>


            <android.support.design.widget.TextInputLayout
                android:id="@+id/txtInputEmail"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <EditText
                    android:id="@+id/txtEmail"
                    style="@style/modifiedEditText"
                    android:ems="10"
                    android:hint="@string/email"
                    android:inputType="textEmailAddress" />

            </android.support.design.widget.TextInputLayout>


            <android.support.design.widget.TextInputLayout
                android:id="@+id/txtInputMob"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <EditText
                    android:id="@+id/txtMob"
                    style="@style/modifiedEditText"
                    android:hint="@string/mobno"
                    android:inputType="phone" />
            </android.support.design.widget.TextInputLayout>


            <android.support.design.widget.TextInputLayout
                android:id="@+id/txtInputReg"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <EditText
                    android:id="@+id/txtReg"
                    style="@style/modifiedEditText"
                    android:hint="@string/reg_no" />

            </android.support.design.widget.TextInputLayout>


            <android.support.design.widget.TextInputLayout
                android:id="@+id/txtInputFeedback"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <EditText
                    android:id="@+id/txtFeed"
                    style="@style/modifiedEditText"
                    android:hint="@string/message"
                    android:inputType="textMultiLine"
                    android:minLines="2" />

            </android.support.design.widget.TextInputLayout>


            <Button
                android:id="@+id/btnSend"
                android:layout_width="100dp"
                android:layout_height="wrap_content"
                android:layout_gravity="right"
                android:background="@drawable/centre_button"
                android:text="@string/send"
                android:textColor="@color/whiteTextColor" />
        </LinearLayout>
    </android.support.v7.widget.CardView>
</android.support.v4.widget.NestedScrollView>
download drawablesDownload

Includes:

  • centre_background.xml
  • centre_button.xml
  • enquiry_bk.png

colors.xml

    <!--colors for modern ui-->
    <color name="whiteTextColor">#fff</color>
    <color name="primaryTextColor">#00a5ff</color>

dimens.xml

<resources>
    <dimen name="newsMoreTextSize">12sp</dimen>
    <dimen name="form_app_bar_height">250dp</dimen>
</resources>

strings.xml

<string name="message">Message</string>
<string name="send">Send</string>
<string name="email">Email</string>
<string name="name">Name</string>
<string name="mobno">Mobile No.</string>
<string name="reg_no">Reg</string>

NB:- activity is set to display app name as activity title, if required change it in manifest.

styles.xml

    <style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>


    <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" >
        <item name="colorControlNormal">@color/whiteTextColor</item>
    </style>

    <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />



    <style name="parent">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">wrap_content</item>
    </style>

    <style name="modifiedEditText" parent="parent">
        <item name="android:textSize">@dimen/newsMoreTextSize</item>
        <item name="android:backgroundTint">@color/primaryTextColor</item>
    </style>


    <style name="centreLocatorCardDesign">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">match_parent</item>
        <item name="android:layout_centerInParent">true</item>
        <item name="android:layout_marginBottom">5dp</item>
        <item name="android:layout_marginTop">5dp</item>
        <item name="android:layout_marginLeft">5dp</item>
        <item name="android:layout_marginRight">5dp</item>
        <item name="android:layout_gravity">center</item>
    </style>

Requires to set supporting toolbar for getting title.

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
     setSupportActionBar(toolbar);
Download Source Code

Project information

  • minSDK : 16
  • max SDK: 27

Credits:

Hero image from freepik.com

Categories: AndroidAndroid designsAndroid UI
Tags:

Kapil Mohan

Like to add color to developers life and apps. Can create smile using Android, iOS, PHP, codeignitor, web technologies, etc... Feel free to contact me at [email protected] .

Related Posts

free classroom ui android studio project
Android Android designs Android UI

Free ClassroomUI android studio project by Shashank Singhal

Classroom UI android studio project Ideal template for edutech, e-commerce, listing, social media applications. Includes complete source code for free

android studio payment app ui
Android Android Animations Android designs Android UI Kotlin

Android studio payment app UI design by Shashank Singhal

Android studio Xml, Kotlin payment app ui with complete source code for free by Shashank Singhal. Ideal for payment app, homepage design templates etc.

free android pinterest ui design xml
Android Android designs Android UI

Free android studio Pinterest UI Xml by Shashank Singhal

Free android xml UI design of pinterest with complete source code by Shashank singhal. For more free designs visit appsnipp.com