Styling android.support.v7.preference.SeekBarPreference - android

First of all I am pretty new in programming Xamarin and Android. I have created a SeekbarPreference but some how they layout does not display all correctly. The value is dropping of from the box (see picture).
My styles.xml:
<?xml version="1.0" encoding="utf-8" ?>
<resources>
<style name="MyTheme" parent="MyTheme.Base">
</style>
<style name="MyTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#EC6A1E</item>
<item name="colorAccent">#EC6A1E</item>
<item name="toolbarStyle">#style/custom_toolbar</item>
<item name="preferenceTheme">#style/PreferenceThemeOverlay.v14.Material.Fix</item>
</style>
<style name="custom_toolbar" parent="#style/Widget.AppCompat.Toolbar">
<item name="titleTextColor">#FFFFFF</item>
</style>
<style name="PreferenceThemeOverlay.v14.Material.Fix" parent="PreferenceThemeOverlay.v14.Material">
<item name="seekBarPreferenceStyle">#style/Preference.SeekBarPreference.Fix</item>
</style>
<style name="Preference.SeekBarPreference.Fix">
</style>
</resources>
Here is my settings.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.preference.PreferenceScreen
xmlns:android="http://schemas.android.com/apk/res/android">
<android.support.v7.preference.SeekBarPreference
android:id="#+id/preference_range_seek_bar"
android:layout_height="wrap_content"
android:key="range"
android:title="Range"
android:summary="Here you can set the range of your location"
android:max="10000"
android:defaultValue="500" />
<android.support.v7.preference.SeekBarPreference
android:key="favRange"
android:title="Favorite Range"
android:summary="Here you can set the range of your Favorite location"
android:max="10000"
android:defaultValue="500" />
<android.support.v7.preference.Preference android:title="Title" android:summary="This is the summary">
</android.support.v7.preference.Preference>
</android.support.v7.preference.PreferenceScreen>
What I do not understand is how can I find which xml attributes I can use on the SeekBarPreference to fix this. When I look in Googles Documents I cannot find a description of xml attributes on this SeekBarPreference.
I know my theme is fuzzy as I played a lot with it. But when I have it working I will adjust this.
Hopefully someone could help me, or have an example..

Ran into the same issue. Here you go with the solution, testion on emulator running API 25:
Step 1, Create a new class that extends SeekBarPreference
public class CustomSeekBarPreference extends SeekBarPreference {
private TextView mSeekBarValueTextView;
public CustomSeekBarPreference(Context context,
AttributeSet attributeSet,
int i, int i1) {
super(context, attributeSet, i, i1);
}
public CustomSeekBarPreference(Context context, AttributeSet attributeSet, int i) {
super(context, attributeSet, i);
}
public CustomSeekBarPreference(Context context, AttributeSet attributeSet) {
super(context, attributeSet);
}
public CustomSeekBarPreference(Context context) {
super(context);
}
#Override
public void onBindViewHolder(PreferenceViewHolder preferenceViewHolder) {
super.onBindViewHolder(preferenceViewHolder);
mSeekBarValueTextView = (TextView) preferenceViewHolder.findViewById(android.support.v7.preference.R.id.seekbar_value);
if (mSeekBarValueTextView != null) {
LayoutParams layoutParams = mSeekBarValueTextView.getLayoutParams();
layoutParams.height = LayoutParams.WRAP_CONTENT;
mSeekBarValueTextView.setLayoutParams(layoutParams);
}
}
}
In your preferences.xml replace the SeekBarPreference class name with the custom class name.
<com.google.xxx.view.CustomSeekBarPreference
android:key="cacheLimit"
android:title="#string/setting_cache_limit_title"
android:dependency="enableCaching"
android:defaultValue="20"
android:max="40"/>

Related

How to change the font family of SwitchCompat?

I've noticed that the SwitchCompat's font does not seem to change with what I've set in the fontFamily field. I've also tried using styles with custom fontFamily (which works on TextViews) and even the switchTextAppearance field. It does apply on the preview (I know the preview is not really accurate) but not when I tried running it on my test device.
Here's my SwitchCompat:
<android.support.v7.widget.SwitchCompat
style="#style/MyStyle.Body"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="#font/my_font_family"
android:text="Enable"
app:switchTextAppearance="#style/MyStyle.Body"/>
and here's my style:
<style name="MyStyle.Body" parent="Base.TextAppearance.AppCompat.Body1">
<item name="android:textSize">14sp</item>
<item name="android:fontFamily">#font/my_font_family</item>
<item name="android:textColor">#color/color_primary_text</item>
</style>
As you can see, I only really want to change it's font
EDIT
I've changed my style to this
<style name="MyStyle.Switch" parent="Widget.AppCompat.CompoundButton.Switch">
<item name="android:textSize">14sp</item>
<item name="android:textColor">#color/color_primary_text</item>
<item name="android:fontFamily">#font/my_font_family</item>
<item name="fontFamily">#font/my_font_family</item>
</style>
still doesn't work though
XML settings is not working, therefore I use following code:
someSwitch.setTypeface(ResourcesCompat.getFont(context, R.font.roboto));
Try
parent="Base.TextAppearance.AppCompat.Body1"
replace into this
parent="TextAppearance.AppCompat.Widget.Switch"
Try below
public class CustomSwitchCompact extends SwitchCompat {
public CustomSwitchCompact(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
public CustomSwitchCompact(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public CustomSwitchCompact(Context context) {
super(context);
init();
}
private void init() {
if (!isInEditMode()) {
Typeface myFonts = Typeface.createFromAsset(getContext().getAssets(),
"fonts/Roboto_Bold.ttf");
setTypeface(myFonts);
}
}
}
XML file
<com.test.CustomSwitchCompact
android:id="#+id/switch_compat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:checked="false"
android:padding="20dp"
android:text="SwitchCompat"
android:textOff="OFF"
android:textOn="ON"
app:showText="true" />
Another way to achieve SwitchCompact with custom font
<android.support.v7.widget.SwitchCompat
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"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/adamSwitch"
android:textColor="#color/top_color"
android:textAppearance="#color/top_color"
android:gravity="center"
app:showText="true"
android:fontFamily="#font/my_font_family"
app:theme="#style/Custom.Widget.SwitchCompat"
app:switchPadding="5dp"
/>
in style.xml
<style name="Custom.Widget.SwitchCompat" parent="Widget.AppCompat.CompoundButton.Switch" >
<item name="android:textColorPrimary">#color/blue</item>
<item name="android:textSize">14sp</item>
<item name="android:fontFamily">#font/my_font_family</item>
<item name="android:textColor">#color/color_primary_text</item>
</style>
The only thing that works for me is setSwitchTypeface, not setTypeface:
my_switch.setSwitchTypeface(ResourcesCompat.getFont(context, R.font.my_font))
I've used android:textAppearance instead of android:switchTextAppearance and custom font works now. Also my switch style have Widget.AppCompat.CompoundButton.Switch as parent

Changing minSdkVersion from 15 to 16

When I changed my minSdkVersion then I am getting this error:
android.view.InflateException: Binary XML file line #43: Error inflating class TextView
Eariler it was working fine before I have made the changes.
Here is my style :
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
</style>
<style name="AppTheme.Dark" parent="Theme.AppCompat.NoActionBar">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primary_dark</item>
<item name="colorAccent">#color/white</item>
<item name="colorControlNormal">#color/greyDark</item>
<item name="colorControlActivated">#color/off_white</item>
<item name="android:windowBackground">#color/pink</item>
<item name="android:fontFamily">sans-serif-light</item>
<item name="android:textStyle">normal</item>
<item name="android:windowContentTransitions" tools:targetApi="lollipop">true</item>
<item name="android:windowAllowEnterTransitionOverlap" tools:targetApi="lollipop">true</item>
<item name="android:windowAllowReturnTransitionOverlap" tools:targetApi="lollipop">true</item>
<item name="android:windowSharedElementEnterTransition" tools:targetApi="lollipop">#android:transition/move</item>
<item name="android:windowSharedElementExitTransition" tools:targetApi="lollipop">#android:transition/move</item>
</style>
<style name="AlertDialogCustom" parent="#android:style/Theme.Dialog">
<item name="android:textColor">#color/pink</item>
<item name="android:typeface">normal</item>
<item name="android:height">5dp</item>
<item name="android:textSize">20sp</item>
<item name="android:textStyle">bold</item>
<item name="android:background">#color/white</item>
</style>
I guess there is something wrong with the parent property of a style.
If you are changing your version then also change the support library.You have to change the support lib like for e.g.for api 23 you have to chnage the appcompact library version to 23.
Hope this help.:)
You should try changing
<style name="AlertDialogCustom" parent="#android:style/Theme.Dialog">
to
<style name="AlertDialogCustom" parent="Theme.AppCompat.Dialog">
This is the issue with your font family which you are using in style. May be sans-serif-light font is not available in your assests>>fonts folder. So check with this how to use custom fonts in android.
Here are the steps to follow:
Android Studio:
Step1: Adding font family files to app
A) Go to the (project folder)
B) Then app>src>main
C) Create folder 'assets>fonts' into the main folder.
D) Put your 'abc.ttf' or 'abc.otf' font file into the fonts folder.
Step 2:
Now Create attrs.xml under res folder if it's not exists and add declare-styleable
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="Font">
<attr name="typeface">
<enum name="FuturaLT" value="0" />
<enum name="FuturaLT_Heavy" value="1" />
<enum name="FuturaLT_Light" value="2" />
</attr>
</declare-styleable>
</resources>
//Here FuturaLT/FuturaLT_Heavy/FuturaLT_Light are file names
Note: – enum name should be font type name with underscore(_) uses, it will be easy for you to understand font family usage in your native code. No special character or other letter, otherwise you will got error in gen folder for same attribute id.
Step 3: Create your custom view(Button, TextView, EditText) class:-
package com.myapp.views;
import android.content.Context;
import android.content.res.TypedArray;
import android.util.AttributeSet;
import android.widget.TextView;
import com.myapp.R;
public class CustomTextView extends TextView {
public CustomTextView(Context context) {
super(context);
}
public CustomTextView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public CustomTextView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
try {
TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.Font);
int font = a.getInt(R.styleable.Font_typeface, 0);
a.recycle();
String str;
switch (font) {
case 1:
str = "fonts/FuturaLT.otf";
break;
case 2:
str = "fonts/FuturaLT_Heavy.otf";
break;
case 3:
str = "fonts/FuturaLT_Light.otf";
break;
default:
str = "fonts/FuturaLT.otf";
break;
}
setTypeface(FontManager.getInstance(getContext()).loadFont(str));
} catch (Exception e) {
e.printStackTrace();
}
}
#SuppressWarnings("unused")
private void internalInit(Context context, AttributeSet attrs) {
}
}
Step 4: Add FontManager.java support class
package com.myapp.views;
import android.content.Context;
import android.graphics.Typeface;
import java.util.HashMap;
import java.util.Map;
public class FontManager {
private Map<String, Typeface> fontCache = new HashMap<String, Typeface>();
private static FontManager instance = null;
private Context mContext;
private FontManager(Context mContext2) {
mContext = mContext2;
}
public synchronized static FontManager getInstance(Context mContext) {
if (instance == null) {
instance = new FontManager(mContext);
}
return instance;
}
public Typeface loadFont(String font) {
if (false == fontCache.containsKey(font)) {
fontCache.put(font, Typeface.createFromAsset(mContext.getAssets(), font));
}
return fontCache.get(font);
}
}
Step 5: Usage in XML layout
<?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="match_parent"
android:orientation="vertical">
<com.myapp.views.CustomTextView
android:id="#+id/tv_time_slot"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
app:typeface="FuturaLT" />
</LinearLayout>
You can also use in java code directly:
Typeface tf = Typeface.createFromAsset(getAssets(), "fonts/FuturaLT.ttf");
tvText.setTypeface(tf);
Note:- If you don't use here FontManager to apply typeface and directly use
then you are not able to see your views in graphics preview.

Switch Preference Compat not animating (Support Preference v7)

Background:
I am using SwitchPreferenceCompat of the support preference v7 library by extending it as below in order to have more than one line for the Switch title:
public class MoreLinesSwitchPreference extends SwitchPreferenceCompat {
public MoreLinesSwitchPreference(Context context) {
super(context);
}
public MoreLinesSwitchPreference(Context context, AttributeSet attrs) {
super(context, attrs);
}
public MoreLinesSwitchPreference(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
#Override
public void onBindViewHolder(PreferenceViewHolder holder) {
super.onBindViewHolder(holder);
TextView textView = (TextView) holder.itemView.findViewById(android.R.id.title);
if (textView != null) {
textView.setSingleLine(false);
textView.setTextSize(TypedValue.COMPLEX_UNIT_SP, 20);
}
}
}
My Preferences.xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.preference.PreferenceScreen xmlns:android="http://schemas.android.com/apk/res/android"
android:title="Settings">
<com.sed.al_mabadi_ul_mufeedah.MyCustomListPreference
android:defaultValue="20"
android:entries="#array/fontSize"
android:entryValues="#array/fontSize"
android:icon="#drawable/ic_format_size_24dp"
android:key="fontSize"
android:summary="20"
android:title="#string/settings_font_size" />
<com.sed.al_mabadi_ul_mufeedah.MyCustomListPreference
android:defaultValue="DroidNaskh-Regular"
android:entries="#array/font_face"
android:entryValues="#array/font_face"
android:icon="#drawable/ic_font_24dp"
android:key="fontFace"
android:summary="Choose Font Name"
android:title="#string/settings_font_name" />
<com.sed.al_mabadi_ul_mufeedah.MyCustomListPreference
android:defaultValue="en"
android:entries="#array/language"
android:entryValues="#array/language_short"
android:icon="#drawable/ic_language_24dp"
android:key="language"
android:summary="#string/app_restart"
android:title="#string/app_language_title" />
<com.sed.al_mabadi_ul_mufeedah.MoreLinesSwitchPreference
android:defaultValue="true"
android:icon="#drawable/ic_harakath_8b64ce_24dp"
android:key="diacriticsOn"
android:summary="#string/app_restart"
android:title="#string/show_hide_diacritics" />
<com.sed.al_mabadi_ul_mufeedah.MoreLinesSwitchPreference
android:defaultValue="false"
android:icon="#drawable/ic_night_24dp"
android:key="nightModeOn"
android:summary="#string/app_restart"
android:title="#string/settings_night_mode" />
<com.sed.al_mabadi_ul_mufeedah.MoreLinesSwitchPreference
android:defaultValue="false"
android:icon="#drawable/ic_screen_on"
android:key="alwaysOn"
android:summary="#string/sleep_on"
android:title="#string/settings_screen_on" />
</android.support.v7.preference.PreferenceScreen>
from my Compile dependencies:
compile 'com.android.support:preference-v7:24.2.0'
MyStyle.xml:
<style name="AppTheme.Base" parent="Theme.AppCompat.DayNight.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="colorControlActivated">#color/colorCursor</item>
<item name="colorControlHighlight">#color/colorFocus</item>
<item name="android:textColorPrimary">#color/colorPrimaryText</item>
<item name="android:textColorSecondary">#color/colorSecondaryText</item>
<item name="android:colorBackground">#color/background</item>
<item name="windowActionModeOverlay">true</item>
<item name="preferenceTheme">#style/PreferenceThemeOverlay</item>
</style>
Problem:
The SwitchPreferenceCompat is not animating between ON and OFF values.
I researched:
Why SwitchPreference is not showing animation when switching from on to off & vice versa?
Extending Preference classes in Android Lollipop = losing animation
https://code.google.com/p/android/issues/detail?id=185323
Why the above does not answer my question:
The above and other posts related to SwitchPreference does not speak about SwitchPreferenceCompat rather simply Switch or SwitchPreference
Need help in animating the switch between ON and OFF values.
Thanks for any help.
The problem is fixed now.
I updated the compile dependencies from
compile 'com.android.support:preference-v7:24.2.0'
to
compile 'com.android.support:preference-v7:25.3.0'
and now the same switch preference is animating.
This could probably be a bug in the older versions of support preference.

Apply style for button group in Android

In my Android application I need to apply style for a group of buttons, instead of styling each button individual. Something like this:
<?xml version="1.0" encoding="utf-8"?>
<!-- put here style="#ststyle/Button_Style" -->
<Button android:id="#+id/button1" android:text="#string/b01" />
<Button android:id="#+id/button2" android:text="#string/b02" />
<Button android:id="#+id/button4" android:text="#string/b03" />
<!-- end style -->
You can write the style for button like this ;
style_btn.xml
<style name="style_btn" parent="Wrap">
<item name="android:background">#drawable/btn_bg</item>
<item name="android:gravity">center</item>
<item name="android:textColor">#android:color/white</item>
<item name="android:textStyle">bold</item>
<item name="android:layout_marginTop">4dp</item>
<item name="android:minWidth">90dp</item>
</style>
apply that style to your button :
<Button
android:id="#+id/attach_file"
style="#style/style_btn"
android:layout_centerVertical="true"
android:background="#drawable/orange_bg"
android:drawablePadding="10dp"
android:drawableRight="#drawable/attach"
android:text="#string/str_email_attach" />
If you need the style to all of the buttons in your application, mention in your App theme style, Then no need to apply for every button.
<style name="YourTheme" parent="android:Theme.Light">
<item name="android:buttonStyle">#style/Button</item>
</style>
If you need the style to particluar button , then apply to every button
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="#style/Button"
android:text="Button" />
I know I'm late joining the party but I stumbled across this when trying to figure out the same problem myself.
What I did was:
Depending on how may button groups you have (say 3 for example) you need to subclass button and create three custom button classes (see below)
//Custom button 1
public class CustomButton1 extends Button {
public CustomButton1(Context context, AttributeSet attrs) {
super(context, attrs, R.attr.attrStyle1);
}
public CustomButton1(Context context, AttributeSet attrs, int defStyle) {
super(context, null, R.attr.attrStyle1);
}
}
//Custom button 2
public class CustomButton2 extends Button {
public CustomButton2(Context context, AttributeSet attrs) {
super(context, attrs, R.attr.attrStyle2);
}
public CustomButton2(Context context, AttributeSet attrs, int defStyle) {
super(context, null, R.attr.attrStyle2);
}
}
//Custom button 3
public class CustomButton3 extends Button {
public CustomButton3(Context context, AttributeSet attrs) {
super(context, attrs, R.attr.attrStyle3);
}
public CustomButton3(Context context, AttributeSet attrs, int defStyle) {
super(context, null, R.attr.attrStyle3);
}
}
You can see from the custom classes I have passed a custom attr. These I define in my styles.xml and use them as reference. See my styles.xml below:
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
</style>
<style name="theme1">
<item name="#attr/attrStyle1">#style/CustomButton1</item>
<item name="#attr/attrStyle2">#style/CustomButton2</item>
<item name="#attr/attrStyle3">#style/CustomButton3</item>
<item name="android:background">#color/warning_yellow_colour</item>
</style>
<style name="CustomButton1" parent = "#android:style/Widget.Button">
<item name="android:textColor">#color/white_colour</item>
<item name="android:padding">20dp</item>
<item name="android:background">#color/banner_background_sensor_colour</item>
</style>
<style name="CustomButton2" parent = "#android:style/Widget.Button">
<item name="android:textColor">#color/white_colour</item>
<item name="android:padding">20dp</item>
<item name="android:background">#color/button_red_colour</item>
</style>
<style name="CustomButton3" parent = "#android:style/Widget.Button">
<item name="android:textColor">#color/white_colour</item>
<item name="android:padding">20dp</item>
<item name="android:background">#color/text_blue_colour</item>
</style>
<attr name="attrStyle1" format="reference"/>
<attr name="attrStyle2" format="reference"/>
<attr name="attrStyle3" format="reference"/>
By linking the style to the attr, you then apply that style to your custom class, which you can then duplicate as many times as needed
CustomButton1 theme1 = (CustomButton1)findViewById(R.id.theme1);
CustomButton2 theme2 = (CustomButton2)findViewById(R.id.theme2);
CustomButton3 theme3 = (CustomButton3)findViewById(R.id.theme3);
Hopefully this is of benefit to someone!

How to set style or font to text of a TextView in android?

I want to set style or font to the text in a TextView like the image shown below:
<TextView
style="#style/CodeFont"
android:text="#string/hello" />
You need to Make that codefont style:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="CodeFont" parent="#android:style/TextAppearance.Medium">
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textColor">#00FF00</item>
<item name="android:typeface">monospace</item>
</style>
</resources>
Straight from : http://developer.android.com/guide/topics/ui/themes.html
You need a custom font and then you can do this:
Typeface mFont = Typeface.createFromAsset(getAssets(), "fonts/myFont.ttf");
MyTextView.setTypeface(mFont);
You have to create a "fonts" folder in your assets folder. Drop your font in there.
You could also create a custom TextView of course. Refer to this answer, I gave a while back, if you prefer that.
There is another way if you want to change it on many TextViews, Use a class:
public class MyTextView extends TextView {
public MyTextView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
public MyTextView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public MyTextView(Context context) {
super(context);
init();
}
private void init() {
if (!isInEditMode()) {
Typeface tf = Typeface.createFromAsset(getContext().getAssets(), "fonts/Ubuntu-L.ttf");
setTypeface(tf);
}
}
}
and in the Layout replace:
<TextView
...
/>
With:
<com.WHERE_YOUR_CLASS_IS.MyTextView
...
/>
You could create a layout.xml file that would have your textview in it. Something like :
textView.xml
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
style="#android:style/Holo.ButtonBar" >
If you dont want this then you could create your custom style. Something like this :
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="Custom" parent="#android:style/TextAppearance.Large" >
<item name="android:typeface">monospace</item>
</style>
</resources>
and in the layout file change the style to something like :
style="#style/Custom"

Categories

Resources