Scale Action Bar background image proportionally - java

Im using ActionBar in my Android App, and to customize each of the tabs, i put a background image behing the ActionBar, which looks the following:
On my phone actually it looks fine, but on other phones it's look very squashed. How can i scale the ActionBar proportionally based on the background's ratio? Are there any solution for this? I had to determine the height in fix DPI because if i leave it out, the ActionBar is not even showing up. My style code is the following right now;
<style name="MyActionBar" parent="android:Theme.Holo.Light">
<item name="android:backgroundStacked">#drawable/tab_bg</item>
<item name="android:adjustViewBounds">true</item>
<item name="android:scaleType">fitEnd</item>
<item name="android:height">87dp</item>
</style>
Update:
I just do not know where to Mr.T's xml code. Im using the basic android ActionBar, and i have only one xml named menu.xml, but if i put the code into it, no effect.
I tried to style the actionbar with the following, but still, if i do not specify the android:height parameter, the actionbar remains 0 and do not showing up.
<style name="MyActionBar" parent="android:Theme.Light">
<item name="android:backgroundStacked">#drawable/tab_bg</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:src">#drawable/tab_bg</item>
<item name="android:scaleType">matrix</item>
</style>
The actionbar still looks like the following on some devices;
http://i.imgur.com/yQN67J3.png

You might do it with either scaleType(http://developer.android.com/reference/android/widget/ImageView.ScaleType.html)
You use ImageView instead of background placing it as the first layout's element and specify android:scaleType attribute for it:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/backgrnd"
android:scaleType="matrix" />
...
rest layout components here
...
</RelativeLayout>
or drawable xml

Related

BottomNavigation Icon Elevation Android

I am using in my project a bottom navigation view. In the bar bellow i have 4 icons and when selected they become green and get an elevation. I suspect the color change is coming from the primary color of the app but I want to get rid of the elevation. I am using a BottomNavigation project so all the code in Activity and XML are the basic ones for a bottom nav.
About the position of the selected icon it depends by the label.
It could be empty and in any case you can use the labelVisibilityMode attribute in your BottomNavigationView:
<com.google.android.material.bottomnavigation.BottomNavigationView
app:labelVisibilityMode="unlabeled"
..>
With 4 icons the default value is selected: Label is shown on the selected navigation item.
About the color you can use the itemIconTint attribute.
It is the default selector:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:alpha="1.0" android:color="?attr/colorPrimary" android:state_checked="true"/>
<item android:alpha="0.6" android:color="?attr/colorOnSurface"/>
</selector>
You can use a custom selector
<com.google.android.material.bottomnavigation.BottomNavigationView
app:labelVisibilityMode="unlabeled"
itemIconTint="#color/my_selector"
..>
or just override the default colors in your BottomNavigationView:
<com.google.android.material.bottomnavigation.BottomNavigationView
app:labelVisibilityMode="unlabeled"
android:theme="#style/ThemeOverlay.BottomNavView"
..>
with:
<style name="ThemeOverlay.BottomNavView" parent="">
<item name="colorPrimary">#color/colorAccent</item>
<item name="colorOnSurface">#color/primaryDarkColor</item>
</style>

Toolbar background is working with mipmap and not drawable

I'm using background image in my toolbar, and from some reason the toolbar is working only with mipmap and not with drawable.
In my app_bar_main.xml file:
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#mipmap/bar"
app:popupTheme="#style/AppTheme.PopupOverlay" />
As you can see I've used mipmap instead of drawable, though when I'm using drawable the application crashes and the following error is given:
Binary XML file line #11: Binary XML file line #16: Error inflating
class android.support.v7.widget.Toolbar
Must mention this mipmap using is just making my app very slow, and it skipping frames, so I would like to change it to drawable.
How can I change the toolbar background resource of the image from mipmap to drawable?
EDIT:
Style.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="LightDialogTheme" parent="Theme.AppCompat.Light.Dialog.Alert">
<item name="android:textColor">#android:color/primary_text_light</item>
<item name="background">#drawable/bar</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
</resources>
Seems your xml file is perfect.
What I suggest ,Just resize that image or prepare background image with different different size, which you want to set in to your toolbar and put it in to different drawables / mipmap folders.
android:background="#mipmap/bar"
as we know icon size should be ,
drawable-ldpi (120 dpi, Low density screen) - 36px x 36px
drawable-mdpi (160 dpi, Medium density screen) - 48px x 48px
drawable-hdpi (240 dpi, High density screen) - 72px x 72px
drawable-xhdpi (320 dpi, Extra-high density screen) - 96px x 96px
run your app again and do let me know .
toolbar.xml
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
style="#style/MyToolbarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical">
Themes/Style
<style name="MyToolbarStyle">
<item name="android:maxHeight">#dimen/abc_action_bar_default_height_material</item>
<item name="android:background">#color/primary</item>
<item name="popupTheme">#style/ThemeOverlay.AppCompat.Light</item>
<item name="titleTextAppearance">#style/Theme.Toolbar.Title</item>
<!-- No need for colorPrimary, colorPrimaryDark, colorAccent here
this should go to the AppTheme -->
Try this methos,it works..
Please add this code in your app level build.gradle file
android {
defaultConfig {
.....
vectorDrawables.useSupportLibrary = true
}
}
toolbar_default.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
style="#style/ToolBarStyle"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="#dimen/abc_action_bar_default_height_material"/>
ToolBarStyle
<style name="ToolBarStyle" parent="">
<item name="popupTheme">#style/ThemeOverlay.AppCompat.Light</item>
<item name="theme">#style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>
Other
Please remove below line from you toolbar and try to check it work or not.I am not sure but you just check it.
app:popupTheme="#style/AppTheme.PopupOverlay"
I hope this will help you

Android - button text color not overrided

My theme is:
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="android:windowContentOverlay">#null</item>
<item name="actionBarTheme">#style/MyActionBarTheme</item>
<item name="actionBarStyle">#style/MyActionBarStyle</item>
<item name="circularProgressBarStyle">#style/CircularProgressBar</item>
<item name="actionBarTabTextStyle">#style/MyActionBarTabText</item>
<item name="actionMenuTextColor">#color/white</item>
<item name="actionBarTabBarStyle">#style/MyActionBarTab</item>
</style>
I don't see any style here that can affect my button text color because they are for action bar styling. But I still cannot change my button text color in layout file:
<Button
...
android:textSize="22sp"
android:textColor="#color/yellow"
... />
I can change textSize here but not the textColor. Anyone can tell me why? Shouldn't it be the highest priority for styling? (That means overriding style.xml config if there is one). Please correct me if I am wrong. Much appreciation!
This is what you should be doing:
android:textColor="#android:color/yellow"
instead of
android:textColor="#color/yellow"
button.setTextColor(getApplication().getResources().getColor(R.color.green));
button.setTextColor(Color.parseColor("#ff1100"));
add this into your style
<item name="colorButtonNormal">#color/colorPrimary</item>
or
you can add property android:background to button class like this
<Button
...
android:textSize="22sp"
android:background="#color/yellow"
... />
As TejjD said :
This is what you should be doing:
android:textColor="#android:color/yellow" instead of
android:textColor="#color/yellow"
You have to define your custom color in Colors.xml file.

Change only one state (the default state) of an ImageButton background

I'd like to change the background for an image button. Basically the image I have looks great on a transparent background and a bit lousy when there are a bunch of them all with a non-transparent background.
This should be easy - just change the android:background on the button to a transparent color (via a drawable):
click_background.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true"><color android:color="#FF008080" />
</item>
<item android:state_pressed="true"><color android:color="#FF008080" />
</item>
<item><color android:color="#00000000" />
</item>
</selector>
Then the button
<ImageButton
android:id="#+id/players"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center"
android:background="#drawable/click_background"
android:contentDescription="#string/players"
android:src="#drawable/speaker_tile" />
The problem is that I actually want to retain the state_focussed and state_pressed versions of the background (which I presume is derived from the theme). I would like to have the background appear when the button is pressed or selected (and appear with the exact same colour/drawable) that would be used by the theme normally when a button is pressed would be helpful.
I was wondering if there is a way to do one of the following, but have so far been unable to find anything on either:
Define a selector that in some what inherits from another (similar to the way a theme can inherit from another).
Create an entirely new selector but have it's XML reference the color/drawable of the theme's state_focussed and state_pressed used for an image button. Edit: It looks like this option is out. I would have needed attributes, but you can't reference them from a drawable. See here
I'd like to do this in Declarative XML rather than Programmatic Java if possible.
You can copy the drawables used by the Android OS into your project and use them in your state-list drawable. You can find the images in {android-sdk-directory}/platforms/android-##/data/res/drawable[-*dpi]
EDIT:
If you go to {android-sdk-directory}/platforms/android-##/data/res/values, you'll find the themes.xml and styles.xml files used by Android. Using them you can figure out which drawables you'll be looking for.
For example, the default theme on newer versions of Android is Theme.Holo. This theme has a default style for ImageButtons declared like so:
<item name="imageButtonStyle">#android:style/Widget.Holo.ImageButton</item>
In styles.xml, this style is defined as follows:
<style name="Widget.Holo.ImageButton" parent="Widget.ImageButton">
<item name="android:background">#android:drawable/btn_default_holo_dark</item>
</style>
Thankfully the background attribute is right there defined in plain sight. Sometimes it's inherited from a parent style and you have to find that instead. In any case, here's the drawable (found in the /drawable directory since it's xml):
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_window_focused="false" android:state_enabled="true"
android:drawable="#drawable/btn_default_normal_holo_dark" />
<item android:state_window_focused="false" android:state_enabled="false"
android:drawable="#drawable/btn_default_disabled_holo_dark" />
<item android:state_pressed="true"
android:drawable="#drawable/btn_default_pressed_holo_dark" />
<item android:state_focused="true" android:state_enabled="true"
android:drawable="#drawable/btn_default_focused_holo_dark" />
<item android:state_enabled="true"
android:drawable="#drawable/btn_default_normal_holo_dark" />
<item android:state_focused="true"
android:drawable="#drawable/btn_default_disabled_focused_holo_dark" />
<item
android:drawable="#drawable/btn_default_disabled_holo_dark" />
</selector>
So those are the drawables Android uses for the background of a standard ImageButton in the default (holo dark) theme.

Android Preference Screen Layout

I have the following preference screen in my app
<PreferenceScreen
xmlns:android="http://schemas.android.com/apk/res/android">
<EditTextPreference
android:key="edittexvalue"
android:id="#+id/edittextvalue"
android:title="Title Here"
android:summary="Summary Here"
android:defaultValue="Some Value"/>
<Preference
android:key="customPref"
android:title="Title Here"
android:summary="Summary Here"/>
</PreferenceScreen>
All of that works just fine however my app i have custom backgrounds and text colors/sizes but i can't figure out how to format the PreferenceScreen I assume you point this at another xml? but can't figure out the code i need and what changes should be made. The main concern is the background color the text is fine i guess but the background just doesn't match the rest of my app. So i'd like to set a custom background color lets say red for now (#ff0000)
I thank anyone that can help me with this problem
You can to apply a theme to it in your manifest, for example
<activity android:name=".Settings"
android:theme="#style/YourStyle"/>
and in your styles.xml (if you dont have one, create it in the values folder)
you can modify whatever you need
For example
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="YourStyle" parent="android:Theme.Light">
<item name="android:listViewStyle">#style/Widget.ListView</item>
<item name="android:windowNoTitle">true</item>
</style>
<style name="Widget" parent="android:Widget">
</style>
<style name="Widget.ListView">
<item name="android:background">#color/white</item>
<item name="android:divider">#color/gray_division</item>
<item name="android:dividerHeight">2dip</item>
</style>
</resources>
I hope this helps

Categories

Resources