I changed the ActionBar height in themes.xml with this
<item name="actionBarSize">30dp</item>
The height of ActionBar changes but then it throws the alignment of my first control off.
Before changing ActionBar height:
After changing Actionbar height
The first Spinner control is aligned to the top of the Layout
<androidx.constraintlayout.widget.ConstraintLayout
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"
tools:context=".fragments.MainFragment">
<Spinner
android:id="#+id/spSessionsMain"
android:layout_width="match_parent"
android:layout_height="30dp"
android:background="#drawable/background_spinner"
android:spinnerMode="dropdown"
app:layout_constraintLeft_toRightOf="parent"
app:layout_constraintRight_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
/>
I'm at a complete loss.
This is happening because the Action bar has a min height of 64dp by default defined in its style :
ActionBar style : (Just for reference don't copy paste this in your theme)
<style name="Widget.MaterialComponents.Light.ActionBar.Solid" parent="Widget.AppCompat.Light.ActionBar.Solid">
<item name="titleTextStyle">?attr/textAppearanceHeadline6</item>
<item name="subtitleTextStyle">?attr/textAppearanceSubtitle1</item>
<!-- Overrides minimum height in landscape to avoid headline6 and subtitle1 height concerns. -->
<item name="android:minHeight">#dimen/mtrl_toolbar_default_height</item>
<item name="maxButtonHeight">#dimen/mtrl_toolbar_default_height</item>
</style>
If you want to remove the gap between your spinner and the action bar you can override the min height of the bar. like this :
<style name="CustomActionBar" parent="Widget.MaterialComponents.Light.ActionBar.Solid">
<item name="android:minHeight">30dp</item>
</style>
Then add this line to your main theme :
<item name="actionBarStyle">#style/CustomActionBar</item>
Related
I'm trying to add a gradient to my statusbar , this is my code :
getWindow().addFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS);
getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
it moves up the toolbar on the status bar and also covers up the navigation bar with the activity's content like this . I made my toolbar height bigger and solve the first problem but is there any way to preventing this code covering my navigation bar ?
anyway , is there any better way to add gradient to my statusbar without changing the toolbar height ?
Just follow the following thing it will work for you, in my case its working perfect
Make layout like bellow
main_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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:background="#mipmap/ic_launcher"
android:fitsSystemWindows="true"
tools:context=".SplashActivity">
<androidx.appcompat.widget.AppCompatImageView
android:layout_width="#dimen/_150sdp"
app:layout_constraintEnd_toEndOf="parent"
android:src="#drawable/cell_background"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:layout_height="#dimen/_150sdp" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
and bellow tow flags
getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
Apply bellow theme to your screen
<style name="AppThemeTrans" parent="Theme.AppCompat.DayNight.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#android:color/transparent</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="colorControlNormal">#FFFFFF</item>
<item name="android:windowTranslucentStatus">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:windowTranslucentNavigation">false</item>
<item name="android:navigationBarColor">#color/navigationBarColor</item> <!--Change Navigationbar background color here-->
</style>
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 >
I'm testing the new Toolbar and AppCompat theme on Android and ran into a problem. My toolbar title text looks normal-sized on portrait mode but it became rather small on landscape mode although I didn't do anything in the code to change the title's text size. Here are the screen shots:
activity_main.xml:
<!-- A DrawerLayout is intended to be used as the top-level content view using match_parent for both width and height to consume the full space available. -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
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="com.techfunmyanmar.jujaka.ui.MainActivity">
<android.support.v7.widget.Toolbar
android:id="#+id/main_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- 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" />
<!-- 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"
android:name="com.techfunmyanmar.jujaka.ui.NavigationDrawerFragment"
android:layout_width="#dimen/navigation_drawer_width"
android:layout_height="match_parent"
android:layout_gravity="start"
tools:layout="#layout/fragment_navigation_drawer" />
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
styles.xml:
<resources>
<!-- Base application theme. -->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="windowActionBar">false</item>
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primary_dark</item>
<item name="colorAccent">#color/accent</item>
</style>
<!-- Main application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
</style>
<style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle">
<item name="spinBars">true</item>
</style>
</resources>
I tried to set android:titleTextAppearance of the toolbar but the style wasn't being applied. Then I realized I'm using the AppCompat theme so I used app:titleTextAppearance and the style is now being applied. It looks like the small letters in landscape are a problem in the built-in AppCompat.Toolbar.Title style itself so I overrode it to set the font size manually. The final code:
Toolbar XML:
<android.support.v7.widget.Toolbar
android:id="#+id/main_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:titleTextAppearance="#style/ToolbarTitle"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
Toolbar Style:
<style name="ToolbarTitle" parent="#style/TextAppearance.Widget.AppCompat.Toolbar.Title">
<item name="android:textSize">20sp</item>
</style>
AOSP Issue #170707 was written regarding the change in text size for title and subtitle. Project Member response was "Works as intended. Identical to framework behavior." Although I don't find changing the text size to be the desirable default behavior, it sounds like the AppCompat engineers had to maintain consistency with the (flawed) framework behavior. Developers are then left to override the default styles as described in Chilly Chan's answer.
Additions to Chilly Chan's answer:
1) The subtitle text size can be controlled in a similar way by defining another style derived from TextAppearance.Widget.AppCompat.Toolbar.Subtitle.
2) Default values for title/subtitle size in portrait orientation are 20dp/16dp (on my Galaxy S3, 4.4.2.). Chilly Chan's example specifies "17sp". Use "sp" only if you want to let user preference setting affect title/subtitle size.
I was looking for a solution without custom Toolbar, but with custom style and this code did the trick for me:
styles.xml
<style name="MyTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<style name="MyActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid">
<item name="titleTextStyle">#style/MyTitleTextStyle</item>
</style>
<style name="MyTitleTextStyle" parent="#style/TextAppearance.AppCompat.Title">
<item name="android:textSize">20sp</item> <!-- Default for portrait is 20sp and for landscape 14sp-->
</style>
AndroidManifest.xml
<activity
android:name=".MainActivity"
android:label="#string/app_name"
android:theme="#style/MyTheme"/>
Where the MainActivity extends AppCompatActivity; tested on API 19, 22 and 23.
Try to add this to your toolbar section under the activity_main.xml.
android:minHeight="?android:attr/actionBarSize"
I also noticed that you are using standard dark action bar , suggest to use Theme with no action bar , defined a new toolbar where
Toolbar toolbar = (Toolbar) findViewById(R.id.my_awesome_toolbar);
setSupportActionBar(toolbar);
<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” />
I think it has to do with some layout changes performed when you rotate the device, ast it looks like you can prevent the resize by adding something like
android:configChanges="orientation|screenSize"
in the AndroidManifest.xml for the activity you're in. As always, android:configChanges has more implications so should be used only if you really need it :)
It's easy to change the background color of the whole action bar, or the text color of only the action bar title but I've found no way to change the background color of only the title like this :
I've tried :
<style name="MyActionBar.TitleTextStyle" parent="#android:style/TextAppearance.Holo.Widget.ActionBar.Title">
<item name="android:textColor">#000</item>
<item name="android:padding">5px</item>
<item name="android:background">#CC0000</item>
</style>
But only textColor works
Try following code on onCreate()
getActionBar().setBackgroundDrawable(new ColorDrawable(color.white));
First things first you need to have a custom theme declared for your application (or activity, depending on your needs). Something like…
<!-- Somewhere in AndroidManifest.xml -->
<application ... android:theme="#style/ThemeSelector">
Then, declare your custom theme for two cases, API versions with and without the Holo Themes. For the old themes we’ll customize the windowTitleBackgroundStyle attribute, and for the newer ones the ActionBarStyle.
<style name="ThemeSelector" parent="android:Theme.Light">
<item name="android:windowTitleBackgroundStyle">#style/WindowTitleBackground</item>
</style>
<style name="WindowTitleBackground">
<item name="android:background">#color/title_background</item>
</style>
<style name="ThemeSelector" parent="android:Theme.Holo.Light">
<item name="android:actionBarStyle">#style/ActionBar</item>
</style>
<style name="ActionBar" parent="android:style/Widget.Holo.ActionBar">
<item name="android:background">#color/title_background</item>
</style>
That’s it! Here we use #color/title_background as a background. It could also be a drawable, and you can also customize other attributes .
I created an ImageView where the Action Bar would have been by using 2 RelativeLayouts (0 padding on the outer, ordinary padding on the inner). Then I added the ImageView to the outer layout and manipulated it from there to act like an action bar, but with much more of my own control.
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffffff"
tools:context="dayOfWeekApp.MainActivity"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="100dp"
android:id="#+id/topBorder"
android:elevation="-1dp"
android:background="#649175"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"/>
<RelativeLayout
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"
>
Other layout elements...
The actionbar shows a space on the left side of the logo. This space is reserved for the upindicator i think.
I want to give this space a defined distance of 20dp for example.
How can i do this?
I can set the padding of the icon to 0, but that does not remove the space between the logo and the left side of the screen.
I tried to solve it by using a custom layout. But there is a little problem. Every time the activity launches, first the normal actionbar appears and then shows the custom layout.
This is how i show my custom view:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_custom);
// Set up the action bar.
final ActionBar actionBar = getActionBar();
//set custom actionbar
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setCustomView(R.layout.actionbar);
//Displays the custom design in the actionbar
actionBar.setDisplayUseLogoEnabled(false);
actionBar.setDisplayHomeAsUpEnabled(false);
actionBar.setDisplayShowHomeEnabled(false);
actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
}
This is in my styles.xml:
<!--Customize the actionbar-->
<item name="android:windowActionBarOverlay">false</item>
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="android:actionButtonStyle">#style/MyActionButton</item>
</style>
<style name="MyActionBar" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">#color/green2</item>
<item name="android:icon">#drawable/app_icon_small</item>
<!-- Support library compatibility -->
</style>
<style name="MyActionButton" parent="#android:style/Widget.Holo.Light.ActionButton">
<item name="android:paddingRight">#dimen/padding_border</item>
<item name="android:paddingLeft">#dimen/padding_border</item>
<item name="android:src">#drawable/icon_plus</item>
<!--<item name="android:minWidth">0dp</item>-->
<!--<item name="android:paddingLeft">0dp</item>-->
<!--<item name="android:paddingRight">15dp</item>-->
<!-- Support library compatibility -->
</style>
This is the layout of the custom view:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:background="#color/green2">
<ImageView
android:id="#+id/header"
android:contentDescription="#string/app_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="#dimen/padding_border"
android:paddingRight="#dimen/padding_border"
android:src="#drawable/app_icon_small"/>
<EditText
android:id="#+id/et_actionbar_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="YOLO"
android:gravity ="center"
android:textColor="#android:color/black"
android:textStyle="bold"
android:background="#android:color/transparent"
/>
</LinearLayout>
You can create xml file(your_xml_file) in folder /res/drawable, like this:
<?xml version="1.0" encoding="UTF-8"?>
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:drawable="#drawable/menu_button"
android:right="20dp"/>
</layer-list>
and add it to code:
<activity android:name=...
android:logo="#drawable/your_xml_file" >
To reduce the space between the left side of the screen and the logo I used it:
<style name="AppTheme" parent="android:Theme.Holo">
<item name="android:actionBarStyle">#style/ActionBarStyle</item>
</style>
<style name="ActionBarStyle" parent="#android:style/Widget.Holo.ActionBar">
<item name="android:layout_marginLeft">-11dp</item>
</style>