Lollipop Drawer Fragment appears behind bottom bar - android

In my app my navigation drawer layout is as follows:
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/nav_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ccc"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:orientation="vertical"
tools:context=".NavigationDrawerFragment">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="#color/blue"
android:orientation="vertical"
android:paddingEnd="#dimen/drawer_padding"
android:paddingLeft="#dimen/drawer_padding"
android:paddingRight="#dimen/drawer_padding"
android:paddingStart="#dimen/drawer_padding">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="50dp"
android:paddingTop="5dp"
android:src="#drawable/menu_logo" />
<TextView
android:id="#+id/drawer_user"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="10dp"
android:textColor="#android:color/white" />
</LinearLayout>
<View
android:id="#+id/divider"
android:layout_width="match_parent"
android:layout_height="5dp"
android:layout_below="#+id/header"
android:background="#color/yellow" />
<LinearLayout
android:id="#+id/bottom_options"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="50dp"
android:layout_alignParentBottom="true"
android:background="#color/white"
android:orientation="vertical"
android:paddingEnd="#dimen/drawer_padding"
android:paddingLeft="#dimen/drawer_padding"
android:paddingRight="#dimen/drawer_padding"
android:paddingStart="#dimen/drawer_padding">
<LinearLayout
android:id="#+id/drawer_settings"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="#dimen/drawer_item_padding"
android:paddingTop="#dimen/drawer_item_padding">
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:src="#drawable/ic_drawer_settings" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="10"
android:paddingLeft="#dimen/drawer_padding"
android:text="#string/drawer_settings"
android:textSize="#dimen/menu_item_text" />
</LinearLayout>
<LinearLayout
android:id="#+id/drawer_logout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:paddingBottom="#dimen/drawer_item_padding"
android:paddingTop="#dimen/drawer_item_padding">
...
</LinearLayout>
</LinearLayout>
<ScrollView
android:background="#color/white"
android:id="#+id/scroller"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/bottom_options"
android:layout_below="#+id/divider"
android:paddingEnd="#dimen/drawer_padding"
android:paddingLeft="#dimen/drawer_padding"
android:paddingRight="#dimen/drawer_padding"
android:paddingStart="#dimen/drawer_padding"
android:scrollbarStyle="outsideOverlay">
<LinearLayout
android:id="#+id/main_options"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
...
</LinearLayout>
</ScrollView>
</RelativeLayout>
</android.support.v4.widget.DrawerLayout>
However in Lollipop the drawer seems to be "underneath" the bottom bar buttons. In Kitkat (image to the right) it works fine (there should be padding there):
What I have tried:
Adding <item name="android:fitsSystemWindows">true</item> to the App Theme
The only "answer" here does not work: In Android 5.0 listview tuple overlaps bottom bar

So I had to add this to a styles-v21:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:windowDrawsSystemBarBackgrounds">false</item>
<item name="android:windowTranslucentStatus">true</item>
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
Which made the views align but turned my status bar bright blue. So I added a style for each activity (v21):
<style name="activityStyle">
<item name="android:paddingTop">25sp</item> <!-- so that it's under the status bar -->
<item name="android:background">#color/colorPrimaryDark</item>
</style>

Related

How to adjust space between Icon and Title in NavigationView?

How to adjust this ? I am trying to make a navigation drawer in my app,I managed to add horizontal lines between items, but I want to adjust space between the icon and the title.
The best approach is to use a RecyclerView inside NavigationDrawer. You can always customize a recyclerView item (i.e. providing gaps between different elements).
another way to implement this,,
use navigation bar like this
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="end"
app:headerLayout="#layout/drawer_header"
android:background="#00fdfdfd"
app:itemIconTint="#android:color/white"
app:itemTextColor="#android:color/white">
<LinearLayout
android:animateLayoutChanges="true"
android:layout_marginTop="45dp"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/pull_navBar"
android:layout_width="35dp"
android:layout_height="match_parent">
<ImageView
android:layout_marginTop="105dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_double_arrow_left"/>
</LinearLayout>
<LinearLayout
android:background="#color/grey"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:padding="2dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="2">
<TextView
android:textColor="#android:color/holo_blue_light"
android:text="Date"
android:textSize="16dp"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" />
<TextView
android:textColor="#android:color/holo_blue_light"
android:text="Session Name"
android:layout_weight="1"
android:textSize="16dp"
android:layout_width="0dp"
android:layout_height="wrap_content" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/rec_sessionList"
android:layout_width="match_parent"
android:layout_height="fill_parent"/>
</LinearLayout>
</LinearLayout>
</android.support.design.widget.NavigationView>
you can put any root layout inside the navigation and achive any view
Add this code in style.xml
<style name="NavStyle" parent="Base.TextAppearance.AppCompat">
<item name="android:textSize">14sp</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">#color/candidate_title</item>
<item name="android:padding">0dip</item>
</style>
and set app:itemIconPadding="#dimen/activity_margin_10dp"
app:itemTextAppearance="#style/NavStyle"in NavigationView

Why some portion of my android app user interface is cropped?

I am using these following theme for my app.
But I cannot find out the reason why some portion has cropped.
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="alertDialogTheme">#style/MyAlertDialogStyle</item>
<item name="alertDialogStyle">#style/MyAlertDialogStyle</item>
<item name="android:windowBackground">#drawable/background_splash</item>
</style>
Here is the screenshot of my app User interface. The border sides are cropped.
Here is my activity_main.XML
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:background="#color/White"
tools:context="com.ff.foodbio.MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="#+id/reloadLayout"
android:layout_width="match_parent"
android:background="#000"
android:layout_height="45dp">
<ImageView
android:id="#+id/btnReload"
android:layout_width="20dp"
android:layout_height="match_parent"
android:layout_marginLeft="20dp"
android:src="#drawable/reload"
android:layout_alignParentLeft="true"
android:tint="#fff"
android:visibility="gone"
android:scaleType="fitCenter"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_toRightOf="#+id/btnReload"
android:layout_toLeftOf="#+id/settings"
android:textSize="20sp"
android:textColor="#fff"
android:gravity="center"
android:visibility="gone"
android:text="Food BIO"/>
<ImageView
android:layout_width="100dp"
android:layout_height="match_parent"
android:src="#drawable/foodbio_text"
android:layout_centerInParent="true"
android:gravity="center"/>
<ImageView
android:id="#+id/settings"
android:layout_alignParentRight="true"
android:layout_width="30dp"
android:layout_marginRight="20dp"
android:layout_height="match_parent"
android:tint="#fff"
android:src="#drawable/menu"
android:scaleType="fitCenter"/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/tabLayout"
android:layout_width="wrap_content"
android:layout_height="55dp"
android:background="#color/Black"
android:layout_below="#+id/reloadLayout">
<android.support.v7.widget.RecyclerView
android:id="#+id/tabRecyclerView"
android:layout_width="wrap_content"
android:clipToPadding="false"
android:background="#color/Black"
android:layout_height="match_parent">
</android.support.v7.widget.RecyclerView>
</RelativeLayout>
<RelativeLayout
android:id="#+id/separatorBar"
android:layout_width="match_parent"
android:layout_below="#+id/tabLayout"
android:layout_marginTop="-2dp"
android:layout_height="5dp">
</RelativeLayout>
<FrameLayout
android:id="#+id/root_fragment_one"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/separatorBar">
</FrameLayout>
</RelativeLayout>
</FrameLayout>
I could not find out the problem. What is the wrong with my code?
How can I solve this problem?

Android Fullscreen Dialog padding issue on marshmallow

I am trying to figure out hw to remove padding from FUllscreen dialog
below is styles which we are using while creating dialog object :
<style name="full_screen_dialog" parent="#android:style/Theme.Dialog">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">match_parent</item>
<!-- No backgrounds, titles or window float -->
<item name="android:windowBackground">#null</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowIsFloating">false</item>
<item name="android:padding">0dp</item>
<item name="android:layout_margin">0dp</item>
<item name="android:layout_gravity">bottom</item>
<!-- Just to prove it's working -->
<item name="android:background">#00000000</item>
</style>
below is the dialog content
<?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="match_parent"
android:orientation="vertical"
android:id="#+id/main_content"
>
<RelativeLayout
android:id="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/layout1"
>
<com.theartofdev.edmodo.cropper.CropImageView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/cropImageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000"
app:cropAspectRatioX="5"
app:cropAspectRatioY="5"
app:cropShape="oval" />
</RelativeLayout>
<LinearLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal"
android:weightSum="100">
<Button
android:id="#+id/cancel"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="50"
android:background="#a9aeac"
android:clickable="true"
android:focusable="true"
android:text="Cancel"
android:textColor="#000000" />
<Button
android:id="#+id/submit"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="50"
android:background="#a9aeac"
android:clickable="true"
android:focusable="true"
android:text="Done"
android:textColor="#000000" />
</LinearLayout>
</RelativeLayout>
How to remove padding i have set the style but its not working
Following the codes:
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.your_dialog_content);
dialog.getWindow().setLayout(WindowManager.LayoutParams.MATCH_PARENT, WindowManager.LayoutParams.MATCH_PARENT);
can you try set layouts without style class in xml file?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<EditText
android:id="#+id/add_school_schoolname"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="#string/collegename"
android:inputType="textPersonName" />
<EditText
android:id="#+id/add_school_schoolweb"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="#string/collegeweb"
android:inputType="textPersonName" />
<Button
android:id="#+id/add_school_submit"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Submit" />
</LinearLayout>
</LinearLayout>

Center title on ToolBar

I have a problem, I can't center my title in my Toolbar (#+id/toolbar_title). I tried to put a RelativeLayout, use layout_gravity: center but it doesn't work. I have added colors to distinguish the layout but I can't post pictures yet.
http://hpics.li/72b1cf7
activity_main.xml
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".MainActivity"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="#android:color/holo_green_dark"
app:theme="#style/ToolbarTheme"
app:popupTheme="#style/Theme.AppCompat"
android:layout_gravity="center_vertical"
>
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center"
android:background="#color/primaryDark"
android:textSize="20dp"
/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#color/primary">
<ImageButton
android:id="#+id/show_list_actualites"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_fleche_bas"
android:adjustViewBounds="true"
android:layout_toLeftOf="#+id/loupe"
android:layout_marginLeft="20dp"
android:layout_marginRight="15dp"
android:layout_centerVertical="true"
android:padding="15dp"
android:background="#color/primaryDark"
/>
<!--android:background="#android:color/transparent"-->
<ImageView
android:id="#+id/loupe"
android:layout_width="wrap_content"
android:layout_height="12dip"
android:src="#drawable/ic_rech"
android:rotation="270"
android:adjustViewBounds="true"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:layout_marginRight="20dp"
android:background="#color/primaryDark"
/>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</RelativeLayout>
<RelativeLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="#+id/content_fragment"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<LinearLayout
android:id="#+id/slide_news_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:visibility="gone">
<ListView
android:id="#+id/list_slider_news_menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/action_bar_background"
android:text="Item 1"/>
<Button
android:id="#+id/close_news_slide"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/grey_tranparent"/>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
<ListView
android:id="#+id/left_drawer"
android:background="#android:color/white"
android:layout_width="305dp"
android:layout_height="match_parent"
android:layout_gravity="start"/>
</android.support.v4.widget.DrawerLayout>
styles.xml
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="Theme.AppCompat.Light.NoActionBar" parent="#style/Theme.AppCompat.Light">
<item name="android:windowNoTitle">true</item>
<item name="windowActionBar">false</item>
</style>
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primaryDark</item>
</style>
<style name="AppTheme" parent="AppTheme.Base">
</style>
<style name="ToolbarTheme" parent="Theme.AppCompat">
<item name="android:windowNoTitle">true</item>
<item name="android:textColorPrimary">#color/action_bar_text</item>
<item name="actionMenuTextColor">#color/action_bar_text</item>
<item name="android:textColorSecondary">#color/action_bar_text</item>
<item name="android:layout_gravity">center_horizontal</item>
</style>
</resources>
Centering the Text in the Toolbar is against Android design standards. I think this is why you are having issues accomplishing this. I would not try to adjust your text alignment, which will insure your app fits within the Android ecosystem.
Check this link for details on Toolbar design standards: http://www.google.com/design/spec/layout/structure.html#structure-toolbars
I am not answering how you WOULD do what you are asking, but suggesting that you DON'T do it in the first place (use the standard format, and this will be easier for you).
try this code...
Toolbar's parent is viewgroup. So u cannot design like that. I used FrameLayout to place items.
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#color/primary">
<ImageButton
android:id="#+id/show_list_actualites"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:adjustViewBounds="true"
android:layout_toLeftOf="#+id/loupe"
android:layout_marginLeft="20dp"
android:layout_marginRight="15dp"
android:layout_centerVertical="true"
android:padding="15dp"
android:background="#color/primaryDark"
/>
<!-- android:background="#android:color/transparent"-->
<ImageView
android:id="#+id/loupe"
android:layout_width="wrap_content"
android:layout_height="12dip"
android:src="#drawable/ic_launcher"
android:rotation="270"
android:adjustViewBounds="true"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:layout_marginRight="20dp"
android:background="#color/primaryDark"
/>
</RelativeLayout>
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center"
android:background="#color/primaryDark"
android:textSize="20dp"
android:text="Title"
/>
</FrameLayout>

How to change text color of a custom view list item for menu drawer when selected - DrawerLayout

I am a new android developer. In my app I have a drawer using DrawerLayout of android:
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<ListView
android:id="#+id/left_drawer"
android:layout_width="#dimen/navigation_drawer_width"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:background="#drawable/menu"/>
</android.support.v4.widget.DrawerLayout>
and this is my custom layout for list items:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:id="#+id/itemLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:orientation="vertical"
android:layout_marginTop="0dp"
android:background="?android:attr/activatedBackgroundIndicator">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/drawer_icon"
android:layout_width="45dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="4dp"
android:layout_marginBottom="4dp"
android:layout_marginLeft="12dp"
android:layout_marginRight="12dp"
android:layout_centerVertical="true"
android:padding="4dp"/>
<TextView
android:id="#+id/drawer_itemName"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:minHeight="40dp"
android:textAppearance="#android:style/TextAppearance.Medium"
android:gravity="center_vertical"
android:paddingRight="40dp"
android:textColor="#android:color/white"/>
<TextView
android:id="#+id/drawer_itemExtra"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#ffef5c6f"
android:layout_gravity="center"
android:background="#drawable/menu_counter"
android:layout_marginLeft="20dp"/>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginBottom="1dp"
android:layout_marginTop="1dp"
android:layout_marginLeft="70dp"
android:background="#android:color/white"
android:alpha="0.4"
></View>
</LinearLayout>
</RelativeLayout>
Now I want to change color of first TextView when selected and get rid of current selected background color which I know comes from this:
android:background="?android:attr/activatedBackgroundIndicator"
Anyone can help please?
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:color="#FFFFFF" /> <!-- pressed -->
<item android:state_focused="true" android:color="#ef5c6f" /> <!-- focused -->
<item android:state_activated="true" android:color="#FFFFFF" /> <!-- activated -->
<item android:color="#ef5c6f" /> <!-- default -->
</selector>

Categories

Resources