layout background image android - android

I want to change the default background image of my navigation drawer.
I have a .jpg image (1600x900) in drawable folder. I set android:background="#drawable/bg_1" for LinearLayout, but when i debug the app in my device, the image doesn't appear and i have a white background.
This is my nav_header_main.xml
<?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:id="#+id/AccountInformation"
android:layout_width="match_parent"
android:layout_height="#dimen/nav_header_height"
android:background="#drawable/bg_1"
android:gravity="bottom"
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"
android:theme="#style/ThemeOverlay.AppCompat.Dark"
android:weightSum="1">
<ImageView
android:id="#+id/imageView"
android:layout_width="70dp"
android:layout_height="60dp"
android:layout_weight="0.3"
android:paddingTop="#dimen/nav_header_vertical_spacing"
app:srcCompat="#drawable/contatti" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/nav_header_vertical_spacing">
<Spinner
android:id="#+id/AccountSpinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/AccountEmail"
android:layout_alignParentEnd="true"
android:layout_alignParentTop="true" />
<TextView
android:id="#+id/AccountName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Android Studio"
android:textAppearance="#style/TextAppearance.AppCompat.Body1"/>
<TextView
android:id="#+id/AccountEmail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/nav_header_vertical_spacing"
android:text="android.studio#android.com" />
</RelativeLayout>
</LinearLayout>
And this is the layout of the activity (activity_main.xml)
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<include
layout="#layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<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/nav_header_main"
app:menu="#menu/activity_main_drawer" />
</android.support.v4.widget.DrawerLayout>

The attibute android:background="#drawable/bg_1" should be in the NavigationView view not the LinearLayout ViewGroup.
Hope this help.

You are doing it wrong.
See you have to apply the following:
android:background="#drawable/bg_1"
to NavigationView block in the other xml file
not to linearLayout which you include as Header Layout in the navigationView

Please try a .png image for that,
or after that check a color code android:background="#651FFF".
Hope this help.

Related

Not able to do Navigation Drawer Below toolbar

How to fit the Navigation Drawer under toolbar it's overlaps the main layout.
activity_set_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:fitsSystemWindows="true"
tools:openDrawer="start"
>
<include
layout="#layout/app_bar_set_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#000000"
android:layout_marginTop="?android:attr/actionBarSize"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:itemTextColor ="#FFFFFF"
app:headerLayout="#layout/nav_header_set_main"
app:menu="#menu/activity_set_main" />
</android.support.v4.widget.DrawerLayout>
app_bar_set_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.example.pash.icas_nvod.setMain">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
>
<ImageView
android:layout_width="220dp"
android:layout_height="40dp"
android:src="#drawable/bydesign_logo"
android:layout_marginRight="80dp"
android:id="#+id/toolbar_title" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_set_main" />
</android.support.design.widget.CoordinatorLayout>
content_set_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:id="#+id/content_set_main_drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#EE7F22"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.example.pash.icas_nvod.setMain"
>
<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" />
</RelativeLayout>
Above are my xml files am not able make drawer fit under the toolbar.
The drawer layout is overlapping to main layout. How to i resolve it..?
I have searched alot but none of the answer relates to my problem.Thank you in advance.
You can try android:layout_below="#+id/app_bar_set_main" in your DrawerLayout.
-----OR-----
You can try to move your toolbar out of your drawerlayout. So in my project, i used LinearLayout as root layout. I tried to replace with your components, hope it helps.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<include
layout="#layout/app_bar_set_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:fitsSystemWindows="true"
tools:openDrawer="start"
>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_below="#+id/app_bar_set_main" //Add this line also.
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#000000"
android:layout_marginTop="?android:attr/actionBarSize"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:itemTextColor ="#FFFFFF"
app:headerLayout="#layout/nav_header_set_main"
app:menu="#menu/activity_set_main" />
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
Edit: Also you must add android:layout_below to fit your drawer under toolbar.

Horizontal center items inside NavigationDrawer

I have the following Navigation Drawer menu setup:
Main layout activity_main.xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
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:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<include
layout="#layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="150dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#color/colorPrimaryDark"
android:fitsSystemWindows="true"
android:theme="#style/NavigationViewStyle"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer" >
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
My menu activity_main_drawer.xml:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto" >
<item
android:id="#+id/nav_profile"
app:actionLayout="#layout/menu_item"
android:title=""/>
</menu>
Menu item menu_item.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="75dp"
android:layout_height="75dp"
android:src="#drawable/menu_icon"
android:layout_gravity="center_horizontal"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Menu Title"
android:textSize="16sp"
android:textColor="#color/white"
android:layout_gravity="center_horizontal"/>
</LinearLayout>
The result I get is this:
Result i am getting
Instead I want it to be horizontally centered, what did I do wrong here? I have tried many fixes with the custom layout's gravity (menu_item.xml) as well as the items, nothing seems to work.
I don't know if the app:actionLayout in the menu can be centered or not at all, if not please tell me what is the correct way to make an item like that with the alignment I want.
Thanks in advance.
Try this for the
menu_item.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="wrap_content"
android:gravity="center">
<ImageView
android:id="#+id/image_view"
android:layout_width="match_parent"
android:layout_height="75dp"
android:layout_gravity="center|center_horizontal"
android:src="#drawable/menu_icon" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/image_view"
android:layout_gravity="center_horizontal|center"
android:gravity="center"
android:text="Menu Title"
android:textColor="#color/white"
android:textSize="16sp" />
</RelativeLayout>
Hope this helps
Try this, menu_item.xml you can set gravity to center_horizontal.

Why my toolbar is overlapping my textView?

This is the xml layout of the file
Here, when i made the layout the toolbar is overlapping the content of my textView, Why this is happening.
Have tried several other things but no luck..!!!
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="#+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
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="com.example.alpit.formula2.MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="alpit isfdfsdfwefwes great jhfjhvjhhbnmbjk"
android:textSize="20dp" />
</RelativeLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
app:menu="#menu/navigation_menu"
>
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
This is my current situation.
add top margin to relativelayout like
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:weightSum="1">
I should have written this as comment but I don't have reputations so I have added it as answer
try this give margin to Textview
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="#+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
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="com.example.alpit.formula2.MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text=" alpit isfdfsdfwefwes great jhfjhvjhhbnmbjk"
android:textSize="20dp" />
</RelativeLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
app:menu="#menu/navigation_menu"
></android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
Don't put hard coded values to layout you can try this,
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:text="alpit isfdfsdfwefwes great jhfjhvjhhbnmbjk"
android:textSize="?android:textAppearanceMedium" />
</RelativeLayout>
remove
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
and use into relative_layout
android:layout_marginTop="#dimen/activity_vertical_margin"
Problem is just because you have given padding to your Drawer layout and your relative layout start drawing from top which includes paddingTop also
please try below code
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="#+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:weightSum="1"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="alpit isfdfsdfwefwes great jhfjhvjhhbnmbjk"
android:textSize="20dp" />
</RelativeLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
app:menu="#menu/navigation_menu"
>
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
also you can use parent layout as relative layout and inside these use Drawer layout

Can't slide the menu after adding footer to navigation drawer

I added a footer to the navigation drawer in Android Studio 2.1.3 but I can't slide the menu.
It is always open and it covers the main screen, also it hides the hamburger icon.
I searched but could not find how to solve this issue.
The activity main xml file
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="end">
<include
layout="#layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="right"
android:fitsSystemWindows="true"
app:menu="#menu/activity_main_drawer" />
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:fillViewport="true"
android:layout_height="match_parent"
android:scrollbars="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
app:elevation="0dp"
android:layout_height="wrap_content"
android:layout_width="match_parent"
app:menu="#menu/activity_main_drawer"/>
<LinearLayout
android:id="#+id/spacer_to_bottom"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="0dp"
android:layout_weight="1"/>
<include layout="#layout/nav_footer_main">
</include>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.v4.widget.DrawerLayout>
and the the footer xml file
<?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"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/side_nav_bar"
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"
android:theme="#style/ThemeOverlay.AppCompat.Dark">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/facebook"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:src="#drawable/fb"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/twitter"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:src="#drawable/twitter"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/youtube"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:src="#drawable/youtube"/>
</LinearLayout>
and the screenshot my app

Android Navigation View - items elevation

Is there a way, using the NavigationView element of the Google support library, to use elevation on the items inside a NavigationView to achieve something like this:
You can see that the header of the navigation drawer has an elevation, like the footer on the bottom of the view.
I tried to use the "android:elevation" attribute but it seems to not work properly.
Here's my code for the NavigationView at the moment:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="end">
<include
layout="#layout/app_bar_product_list"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="end"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_filters">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:gravity="center|end"
android:padding="16dp"
android:elevation="16dp"
android:orientation="horizontal"
tools:targetApi="lollipop">
<TextView
android:textAppearance="#style/TextAppearance.AppCompat.Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Clear"/>
</LinearLayout>
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
Here's the XML file for the header of the navigation view:
<?xml version="1.0" encoding="utf-8"?>
<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="wrap_content"
android:background="#color/colorAccent"
android:elevation="8dp"
android:gravity="bottom"
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"
android:theme="#style/ThemeOverlay.AppCompat.Light"
tools:targetApi="lollipop">
<android.support.v4.widget.Space
android:layout_width="match_parent"
android:layout_height="#dimen/status_cheat" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/ordina_per"
android:textAppearance="#style/TextAppearance.AppCompat.Subhead"
android:textColor="#android:color/white" />
<android.support.v7.widget.AppCompatSpinner
android:id="#+id/spinner_orders"
style="#style/SpinnerStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
As you see elevation doesn't work in this case. How can I solve this?
Give the root layout of your header layout a layout_marginBottom so that it can get some room to display the elevation shadow.
Like this:
android:layout_marginBottom="8dp"
android:elevation="4dp"

Categories

Resources