lromano
lromano

Reputation: 29

Hide or make transparent the SupportActionBar but keep Navigation Button and icon

I'm creating a map app with Material Design. I can't find a way to hide the SupportActionBar when I change from the MainActivity to a MapFragment to give more viewing area, but at the same time keep visible (with a proper change of color) the navigation button and the app logo like the following image:

enter image description here

I tried with making transparent but the shadows are still visible, and even when I set the elevation as 0... and the area does not respond to any touch event...

Can someone help me with this?

-Update-

There is the actual result i have.

enter image description here

and here is the xml.

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/main_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.NoActionBar">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="56dp"
            app:layout_scrollFlags="scroll|enterAlways"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

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

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <fragment
            xmlns:tools="http://schemas.android.com/tools"
            android:id="@+id/map"
            android:name="com.google.android.gms.maps.SupportMapFragment"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            tools:context="com.xxxx.xxxxx.RequestCabActivity" />
        <LinearLayout
            android:id="@+id/locationMarker"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginBottom="30dp"
            android:gravity="center"
            android:orientation="vertical" >

            <ImageView
                android:id="@+id/imageMarker"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/passenger_pin" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_gravity="center|top"
            android:id="@+id/search_field"
            android:layout_marginTop="60dp"
            android:paddingBottom="@dimen/vertical_page_margin"
            android:paddingLeft="20dp"
            android:paddingRight="20dp"
            android:paddingTop="@dimen/vertical_page_margin">

            <android.support.v7.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="@dimen/margin_medium"
                android:layout_marginBottom="@dimen/margin_medium">

                <fragment
                    android:id="@+id/autocomplete_fragment"
                    android:name="com.google.android.gms.location.places.ui.PlaceAutocompleteFragment"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"/>

            </android.support.v7.widget.CardView>

            <TextView
                android:id="@+id/place_details"
                android:autoLink="all"
                android:textAppearance="?android:attr/textAppearanceMedium"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />

            <TextView
                android:id="@+id/place_attribution"
                android:autoLink="all"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:paddingTop="@dimen/margin_medium" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_gravity="center|bottom"
            android:layout_margin="5dp">

            <android.support.design.widget.FloatingActionButton
                android:id="@+id/button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:srcCompat="@drawable/car_36"
                app:backgroundTint="@color/white"
                android:layout_gravity="center_horizontal"
                android:elevation="4dp"/>

            <TextView
                android:id="@+id/place_details1"
                android:autoLink="all"
                android:textAppearance="?android:attr/textAppearanceMedium"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Solicitar Viaje"
                android:layout_marginBottom="30dp"
                android:layout_marginTop="10dp"/>
        </LinearLayout>

    </FrameLayout>




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

<android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fitsSystemWindows="true"

    app:headerLayout="@layout/navheader"
    app:menu="@menu/menu_navigation" />

And this is how i put transparent the appbar and toolbar in the onCreate method:

appBarLayout = (AppBarLayout) findViewById(R.id.appbar);
    // Create Navigation drawer and inlfate layout
    NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        appBarLayout.setElevation(0);
    }
    appBarLayout.setBackgroundColor(Color.TRANSPARENT);
    // Adding menu icon to Toolbar
    // Set behavior of Navigation drawer
    mContext = this;
    mToolbar = (Toolbar) findViewById(R.id.toolbar);

    // Toolbar :: Transparent
    mToolbar.setBackgroundColor(Color.TRANSPARENT);
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        mToolbar.setElevation(0);
    }

    setSupportActionBar(mToolbar);
    getSupportActionBar().setDisplayShowTitleEnabled(false);
    ActionBar supportActionBar = getSupportActionBar();
    if (supportActionBar != null) {
        VectorDrawableCompat indicator
                = VectorDrawableCompat.create(getResources(), R.drawable.ic_menu, getTheme());
        supportActionBar.setHomeAsUpIndicator(indicator);
        supportActionBar.setDisplayHomeAsUpEnabled(true);
    }

    // Status bar :: Transparent
    Window window = this.getWindow();

    if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP)
    {
        window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
        window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
        window.setStatusBarColor(Color.TRANSPARENT);
    }

I need to have the Navigation button on the left top of the screen because i have a navigation menu and my logo app on the right. If i can put this without the toolbar, but i can work with a a transparent toolbar.

On this sample Transparent action bar and status bar like Uber become a noActionBar activity, but this put a return button, nota navigation button.

Upvotes: 2

Views: 1426

Answers (0)

Related Questions