Top bar for app not hiding android

Question

I have an app and in the Login screen I have multiple ways to login like gmail, facebook and manual login. They all are working nicely but the problem arises when I try to hide the top bar which shows the app name. I know this has something to do with the theme in the manifest but I haven't set any. Please have a look at my code and see what I am doing wrong ...

Manifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    package="com.example.spuck"
    android:versionCode="1"
    android:versionName="1.0">

<uses-sdk
    android:minSdkVersion="16"
    android:targetSdkVersion="23" />


<application
    android:allowBackup="true"
    android:icon="@drawable/the_spuck_4"
    android:label="@string/app_name"
    android:theme="@style/AppTheme">


<activity android:name=".LoginActivity"/>

LoginActivity.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:facebook="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.spuck.LoginActivity"
    style="@style/Red">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:weightSum="1"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:layout_marginBottom="94dp">


    <Button
        android:id="@+id/sign_in"
        android:layout_width="260dp"
        android:layout_height="35dp"
        android:textSize="13dp"
        android:text="Sign In"
        android:textColor="@color/white"
        android:textAllCaps="false"
        android:background="@drawable/signin_button_login_activity"
        android:gravity="center"
        android:layout_below="@+id/login_button"
        android:layout_alignLeft="@+id/sign_in_button"
        android:layout_alignStart="@+id/sign_in_button"
        android:layout_marginTop="33dp" />

    <ImageView
        android:id="@+id/app_name"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/the_spuck_3_2"
        android:background="@drawable/white_with_round"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="30dp" />

    <com.google.android.gms.common.SignInButton
        android:id="@+id/sign_in_button"
        android:layout_width="260dp"
        android:layout_height="35dp"

        android:layout_marginTop="41dp"
        android:layout_below="@+id/app_name"
        android:layout_centerHorizontal="true" />

    <com.facebook.login.widget.LoginButton
        android:id="@+id/login_button"
        android:layout_width="255dp"
        android:layout_height="60dp"
        android:textColor="#ffffff"
        android:layout_marginTop="10dp"
        android:shadowColor="#000"
        android:shadowDx="0"
        android:shadowDy="0"
        android:shadowRadius="10"
        android:layout_below="@+id/sign_in_button"
        android:layout_centerHorizontal="true" />
    </RelativeLayout>
</RelativeLayout>

AppTheme.NoActionBar.xml

<style name="AppTheme.NoActionBar">
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
    <item name="colorPrimary">#ff5050</item>
    <item name="colorPrimaryDark">#ff5050</item>
</style>

Answer 1

Change the theme of the activity to NoActionBar :

<style name="AppTheme.NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
    <item name="colorPrimary">#ff5050</item>
    <item name="colorPrimaryDark">#ff5050</item>
</style>

Answer 2

As Nika said, his approach is absolutely correct. What you need to see is that there are 2 types of themes made. One for API 21 and above and the other for API 21 and below. What you need to do is to assign the theme he said to both versions since you want your app to work for both API conditions. See the code below and let me know if it helped ...

for API 21 and above:

<resources>

    <style name="AppTheme.NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:statusBarColor">#ff5050</item>
        <item name="colorPrimary">#ff5050</item>
        <item name="colorPrimaryDark">#ff5050</item>
    </style>
</resources>

for API 21 and below:

<style name="AppTheme.NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
    <item name="colorPrimary">#ff5050</item>
    <item name="colorPrimaryDark">#ff5050</item>
</style>

Now to access this you need to change your manifest to this:

<activity android:name=".LoginActivity"
        android:theme="@style/AppTheme.NoActionBar"/>

PS if you are not sure on how to see the themes for their respective API hold the ctrl button and click on "AppTheme.NoActionBar" text, it will show you two fields where they are to be found and just edit both of them.