How to customize the title bar in login activity

Question

I am trying to create a login page for my app. I chose login activity from the options while creating the activity at Android-studio. This is what I get then:

I can customize the email/password fields and the signin button from the activity_login.xml file. But, I also need to customize the title bar - for example, aligning the title at center, adding a back button to the title bar and some color modifications.

The problem is I can't find an option to modify it anywhere. Here's what activity_login.xml file looks like:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent"
android:layout_height="match_parent" 
android:gravity="center_horizontal"
android:orientation="vertical" 
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin" 
tools:context=".LoginActivity">

<!-- Login progress -->
<ProgressBar android:id="@+id/login_progress" style="?android:attr/progressBarStyleLarge"
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"
    android:layout_marginBottom="8dp" 
    android:visibility="gone" />

<ScrollView android:id="@+id/login_form" 
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout 
        android:id="@+id/email_login_form" 
        android:layout_width="match_parent"
        android:layout_height="wrap_content" 
        android:orientation="vertical">

        <android.support.design.widget.TextInputLayout 
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <AutoCompleteTextView 
                android:id="@+id/email" 
                android:layout_width="match_parent"
                android:layout_height="wrap_content" 
                android:hint="@string/prompt_email"
                android:inputType="textEmailAddress" 
                android:maxLines="1"
                android:singleLine="true" />

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

        <android.support.design.widget.TextInputLayout 
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <EditText android:id="@+id/password" 
                android:layout_width="match_parent"
                android:layout_height="wrap_content" 
                android:hint="@string/prompt_password"
                android:imeActionId="@+id/login"
                android:imeActionLabel="@string/action_sign_in_short"
                android:imeOptions="actionUnspecified" 
                android:inputType="textPassword"
                android:maxLines="1" 
                android:singleLine="true" />

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

        <Button android:id="@+id/email_sign_in_button" style="?android:textAppearanceSmall"
            android:layout_width="match_parent" 
            android:layout_height="wrap_content"
            android:layout_marginTop="16dp" 
            android:text="@string/action_sign_in"
            android:textStyle="bold" />

    </LinearLayout>
</ScrollView>

Answer 1

You should use 'NoActionBar' Style in 'styles.xml'. Than create toolbar in your layout and add child view to your toolbar, set title and modify as you like.

Answer 2

Change the title in your AndroidManifest.xml

Answer 3

You can add a custom titlebar by replacing action bar. Here is how..

1.create a new xml and lets name it custom_actionbar.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:background="@drawable/black_pattern" >

    <TextView
        android:id="@+id/title_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:textAllCaps="true"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textColor="#fff"
        android:textStyle="bold" />

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="35dp"
        android:layout_height="35dp"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:layout_marginLeft="8dp"
        android:src="@drawable/ic_launcher" />

    <ImageButton
        android:id="@+id/imageButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_marginRight="8dp"
        android:background="@null"
        android:src="@android:drawable/ic_menu_rotate" />

</RelativeLayout>

2. Then in your activity code get your action bar and replace it with this custom layout

   ActionBar mActionBar = getActionBar(); mActionBar.setDisplayShowHomeEnabled(false); mActionBar.setDisplayShowTitleEnabled(false); LayoutInflater mInflater = LayoutInflater.from(this); View mCustomView = mInflater.inflate(R.layout.custom_actionbar, null); TextView mTitleTextView = (TextView)mCustomView.findViewById(R.id.title_text); mTitleTextView.setText("My Own Title"); mActionBar.setCustomView(mCustomView); mActionBar.setDisplayShowCustomEnabled(true);

See this,this and this for more details.

Answer 4

You have to use empty android activity and then by using linear layouts,you can create or customize your own title bar by your self.