why my DrawerLayout drawer header can't reach under statusbar? - android

why my DrawerLayout drawer header can't reach under statusbar?
here is mytheme:
<!-- Application theme. -->
<style name="AppTheme" parent="AppTheme.Base">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<!-- Status bar color -->
<item name="android:statusBarColor">#color/base_color_half</item>
<item name="android:windowTranslucentNavigation">true</item>
<!-- Navigation bar color -->
<item name="android:navigationBarColor">#color/base_color_half</item>
</style>
and my drawer view define:
<!-- Sid Drawer -->
<!-- this layout can reach under statusbar -->
<LinearLayout
android:id="#+id/drawer_view"
android:layout_width="270dp"
android:layout_height="match_parent"
android:layout_gravity="start|top"
android:background="#android:color/white"
android:clickable="true"
android:fitsSystemWindows="true"
android:orientation="vertical">
<!-- but this layout (as header) can not reach under statusbar, just above Toolbar -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/drawer_header">
<TextView
style="#style/DefaultTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:padding="#dimen/padding_base"
android:text="#string/app_name" />
</LinearLayout>
</LinearLayout>
Drawer background is white, and i add a linearlayout as a header, then i get this issue..
I'm sorry but i can't upload image on my level..

Since status bar is a part of the system window, set the fits attribute to false:
android:fitsSystemWindows="false"

Related

How to display the menu icon without action bar?

I'm trying to create the following layout:
In my layout main_act I have:
<!-- Tool bar -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/primaryColor"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</LinearLayout>
<!-- Menu -->
And in Manifest file I have:
<activity
android:name=".MainAct"
android:label="MainAct"
android:theme="#style/MainAct" />
where the "#style/MainAct" is:
<style name="MainAct" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
I want to have no bar in order to use the toolbar so I used parent="Theme.AppCompat.Light.NoActionBar" but it displays the bar anyways with the string MainAct. How can I display the menu icon on the background without the action bar?
Remove the <androidx.appcompat.widget.Toolbar> tag and add an ImageButton on top left corner with menu icon

Switched to AppCompat theme now search bar changed

I added Theme.Appcompat to my application and and now the search icon and the blue line are gone from my search bar. Does anybody know how to get the Holo theme to work with the Theme.Appcompat
follow material design guidelines when using appcompact library
use a toolbar and add your views to it, style it as per your needs, i just made gradient for timebeing.
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#drawable/mygradient"
app:popupTheme="#style/AppTheme.PopupOverlay"
>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="match_parent"
android:gravity="center"
android:weightSum="1">
<EditText
android:layout_width="30dp"
android:layout_height="wrap_content"
android:hint="Search for videos"
android:drawableLeft="#drawable/icon"
android:layout_weight="0.86" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
change the accent color to your holo blue
<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>
</style>

How to change primary and primaryDark color?

current layout
I have a problem related to xml layout, and I don't know how to add primary and primary dark color. Can anybody help me?
main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ListView android:id="#+id/in"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stackFromBottom="true"
android:transcriptMode="alwaysScroll"
android:layout_weight="1"/>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText android:id="#+id/edit_text_out"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="bottom"/>
<Button android:id="#+id/button_send"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/send"/>
</LinearLayout>
</LinearLayout>
How it should look like
You should modify, or create if it didn't exists already the file styles.xml, in the values folder, like that :
<style name="MyMaterialTheme.Base" >
<!-- Primary Color -->
<item name="colorPrimary">#color/colorPrimary</item>
<!-- darker variant for the status bar and contextual app bars -->
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<!-- theme UI controls like checkboxes and text fields -->
<item name="colorAccent">#color/colorAccent</item>
</style>
It gets it's values from colors.xml file.
Do you mean you need to change the color of action bar located at top most position right? Then do this:
so, ActionBar will not work for your target environment which is at API level 10 (Android 2.3.3).
Just in case, if you target for minimum API level 11, you can change ActionBar's background color by defining custom style, as:
<resources>
<style name="MyTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:actionBarStyle">#style/MyActionBar</item>
</style>
<style name="MyActionBar" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">ANY_HEX_COLOR_CODE</item>
</style>
And, set "MyTheme" as theme for application/activity.

Android - set action bar height as a fraction of total height

I am developing an Android application that has an action bar. I know how to set height of action bar in pixels, but I would like to set action bar's height to be 15% of screen's height. Is that possible? Here is what I have so far in my resources file:
<!-- Application theme. -->
<style name="CustomActionBarTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
<item name="android:windowActionBarOverlay">true</item>
<item name="android:actionBarStyle">#style/Widget.Styled.ActionBar</item>
</style>
<style name="Widget.Styled.ActionBar"
parent="#android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
<item name="android:displayOptions">showHome|useLogo</item>
<item name="android:background">#color/white</item>
<item name="android:height">90dp</item>
</style>
You can use below code, to set custom height of ActionBar,
Compatible toolbar for previous versions of Android,Custom height is set in my case i set 100dp instead of 48dp default.
<?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:background="#color/bg"
android:gravity="center_horizontal"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="100dp"
android:background="#e5e5e5"
android:popupTheme="#android:style/ThemeOverlay.Material.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:layout_alignParentTop="true"/>
<-- Your other component or xml code goes here...!-->
</LinearLayout >

Error inflating class android.support.v7.widget.Toolbar

I am trying to use toolbar (android.support.v7.widget.Toolbar) with navigation drawer. But it shows exception "Error inflating class android.support.v7.widget.Toolbar". Code is working fine if I don't use android.support.v7.widget.Toolbar in xml. My activity is extending android.support.v7.app.ActionBarActivity. Here is my main_activity.xml
<!--
As the main content view, the view below consumes the entire
space available using match_parent in both dimensions.
-->
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- We use a Toolbar so that our drawer can be displayed
in front of the action bar -->
<android.support.v7.widget.Toolbar
android:id="#+id/my_awesome_toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary" />
</LinearLayout>
</FrameLayout>
<!--
android:layout_gravity="start" tells DrawerLayout to treat
this as a sliding drawer on the left side for left-to-right
languages and on the right side for right-to-left languages.
If you're not building against API 17 or higher, use
android:layout_gravity="left" instead.
-->
<!--
The drawer is given a fixed width in dp and extends the full height of
the container.
-->
<fragment
android:id="#+id/navigation_drawer"
class="com.jooleh.android.merchant.NavigationDrawerFragment"
android:layout_width="300dp"
android:layout_height="match_parent"
android:layout_gravity="start"
tools:layout="#layout/fragment_navigation_drawer" />
</android.support.v4.widget.DrawerLayout>
Styles.xml
<style name="AppBaseTheme" parent="Theme.AppCompat">
<item name="colorPrimary">#color/red_primary_500</item>
<item name="colorPrimaryDark">#color/red_primary_700</item>
<item name="colorAccent">#color/green_secondary</item>
<item name="windowActionBar">false</item>
</style>
Styles-v11
<style name="AppBaseTheme" parent="Theme.AppCompat">
<!-- API 11 theme customizations can go here. -->
<item name="windowActionBar">false</item>
</style>
Styles-v14
<style name="AppBaseTheme" parent="Theme.AppCompat">
<!-- API 14 theme customizations can go here. -->
<item name="windowActionBar">false</item>
</style>
I am testing on jellybean, minSdkVersion="16" and targetSdkVersion="21".
I was able to solve this problem by replacing the following:
In your Toolbar layout, replace:
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
with
android:minHeight="#dimen/abc_action_bar_default_height_material"
android:background="#color/myColor"
It might be late, but helpful for someone.
I struggled a lot for same problem and then I changed from
android.support.v7.widget.Toolbar
to
android.widget.Toolbar
and it worked, I dont know the reason. If anyone has any insight pls share

Categories

Resources