i need to implement an application in android using styles. I know that, difining an style for each object in styles.xml, it's possible to stablish diferent styles for: Textview, Buttons, editviews..but in the special case of spinner it doesn't work. this is my example:
this is the layout main.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
style="#style/TextviewVerde"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/escribenombre"
/>
<EditText
style="#style/EditviewAzul"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/TxtNombre"
/>
<Spinner
style="#style/SpinnerRojo"
android:textColor="#FFFFFF"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/TxtSpinner"
android:prompt="#string/seleccionetexto"
/>
<Button
style="#style/BotonBlanco"
android:id="#+id/BtnHola"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pulse aqui"
/>
</LinearLayout>
and this is the styles.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="TextviewVerde" >
<item name="android:textColor">#00FF00</item>
<item name="android:typeface">normal</item>
<item name="android:textSize">5pt</item>
<item name="android:gravity">center</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
</style>
<style name="TextviewRosa" >
<item name="android:textColor">#5F04B4</item>
<item name="android:typeface">normal</item>
<item name="android:textSize">15pt</item>
<item name="android:gravity">center</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
</style>
<style name="EditviewAzul" >
<item name="android:textColor">#0000FF</item>
<item name="android:textSize">8pt</item>
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:shadowColor">#0000FF</item>
</style>
<style name="SpinnerRojo" >
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textColor">#DF0101</item>
<item name="android:gravity">center</item>
<item name="android:typeface">normal</item>
<item name="android:textSize">11pt</item>
<item name="android:drawSelectorOnTop">true</item>
</style>
<style name="BotonBlanco">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textSize">12pt</item>
<item name="android:gravity">center_vertical|center_horizontal</item>
<item name="android:textColor">#FFFFFF</item>
<item name="android:shadowColor">#FF000000</item>
<item name="android:clickable">true</item>
</style>
</resources>
every object works well, but the spinner doesn't change its appearance. My boss told me that i have to implement styles without changing the *.java file, what can i do?? i need to change the colour of the spinner options, the backgound, add some pics.. etc. thanks a lot for the help
http://www.mokasocial.com/2011/03/easily-create-a-default-custom-styled-spinner-android/
To make custom styled dropdown when the spinner is clicked, you should create a custom Adapter with a reference to your layout xml defining the rows of the list.
For example:
String[] elements = {"optionA", "optionB"};
Spinner s = (Spinner) findViewById(R.id.your_spinner_id);
ArrayAdapter adapter = new ArrayAdapter<String>(this,
R.id.textViewId, elements);
adapter.setDropDownViewResource(R.layout.your_dropdown_layout);
Where textViewId should be a child view in your_dropdown_layout.
Hope that helped.
Ripityom
Related
I try like this:
styles.xml:
<style name="EditTextStyle" parent="Widget.AppCompat.EditText">
<item name="android:layout_marginBottom">12dp</item>
<item name="android:backgroundTint">#color/editTextUnderline</item>
<item name="android:drawableLeft">#drawable/ic_sample_action</item>
<item name="android:drawablePadding">8dp</item>
<item name="android:paddingTop">15dp</item>
<item name="android:paddingBottom">25dp</item>
<item name="android:textColor">#color/colorTextPrimary</item>
<item name="android:textColorHint">#color/editTextHintColor</item>
<item name="android:textSize">16sp</item>
<item name="android:fontFamily">#font/viga</item>
<item name="android:inputType">text</item>
</style>
And then I use it in layout file:
<EditText
style="#style/EditTextStyle"
android:id="#+id/input_title"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:hint="Title"
android:text="#={viewModel.title}" />
However I do not see any changes. Why could that be?
I chanded style parent to #style/Widget.AppCompat.EditText and it worked.
In newly published Material Design Component, there is no Spinner component. That's why I want to use Exposed Dropdown Menus to implement something similar like Spinner. The Problem I am facing is AutoCompleteTextView is not aligned in center compare to the endIconDrawable. My Code is given bellow
activity.main.xml
<com.google.android.material.textfield.TextInputLayout
style="#style/OutLinedEditTextStyle.Spinner"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Select Country"
android:layout_margin="#dimen/_10sdp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.578"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/materialToolbar"
app:layout_constraintVertical_bias="0.0">
<AutoCompleteTextView
android:id="#+id/filled_exposed_dropdown"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:completionThreshold="1"
android:dropDownVerticalOffset="#dimen/_5sdp"/>
</com.google.android.material.textfield.TextInputLayout>
style.xml
<resources xmlns:tools="http://schemas.android.com/tools">
<style name="OutLinedEditTextStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="boxBackgroundMode">outline</item>
<item name="boxBackgroundColor">#color/colorWindowBackground</item>
<item name="boxStrokeColor">#color/colorTextPrimary</item>
<item name="boxStrokeErrorColor">#color/red</item>
<item name="boxStrokeWidth">#dimen/_2sdp</item>
<item name="boxStrokeWidthFocused">#dimen/_2sdp</item>
<item name="errorTextColor">#color/red</item>
<item name="errorEnabled">true</item>
<item name="hintEnabled">true</item>
<item name="hintTextColor">#color/colorTextPrimary</item>
<item name="android:textColorHint">#color/colorTextSecondary</item>
</style>
<style name="OutLinedEditTextStyle.Spinner">
<item name="materialThemeOverlay">#style/ThemeOverlay.MaterialComponents.AutoCompleteTextView.FilledBox</item>
<item name="endIconMode">custom</item>
<item name="endIconDrawable">#drawable/ic_download</item>
<item name="endIconContentDescription">Drop down</item>
</style>
</resources>
Finally I can solve the problem. The fault was, I inherit the wrong Parent class of Dropdown menu.
<style name="SpinnerStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="boxBackgroundMode">outline</item>
<item name="boxBackgroundColor">#color/colorWindowBackground</item>
<item name="boxStrokeColor">#color/colorTextPrimary</item>
<item name="boxStrokeErrorColor">#color/red</item>
<item name="boxStrokeWidth">#dimen/_2sdp</item>
<item name="boxStrokeWidthFocused">#dimen/_2sdp</item>
<item name="errorTextColor">#color/red</item>
<item name="errorEnabled">true</item>
<item name="hintEnabled">true</item>
<item name="hintTextColor">#color/colorTextPrimary</item>
<item name="android:textColorHint">#color/colorTextSecondary</item>
<item name="endIconMode">clear_text</item>
</style>
Instead of setting the layout_toRightof, layout_toLeftof, layout_above and layout_below parameters everytime a view is created, is there a way to include it in the styles.xml file such that it becomes easier to implement instead of typing it every single time? This is the intended layout.
I've included my activityMain.xml and styles.xml files below.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="24dp"
tools:context="com.example.android.musiclibrary.MainActivity"
android:background="#fcfcfc">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
style="#style/song_group">
<ImageView
android:src="#drawable/n30_Seconds_to_Mars"
android:id="#+id/thumbnail1"
style="#style/icon"
/>
<TextView
android:layout_toRightOf="#id/thumbnail1"
android:text="Up In The Air"
android:id="#+id/song1"
style="#style/song"
/>
<TextView
android:layout_toRightOf="#id/thumbnail1"
android:text="30 seconds to Mars"
style="#style/artist"
/>
</RelativeLayout>
</LinearLayout>
</ScrollView>
Here's my styles.xml file
<resources>
<!-- Base application theme. -->
<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>
<style name="icon">
<item name="android:scaleType">fitCenter</item>
<item name="android:maxWidth">42dp</item>
<item name="android:maxHeight">42dp</item>
<item name = "android:adjustViewBounds">true</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">match_parent</item>
</style>
<style name="song">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_marginLeft">6dp</item>
<item name="android:textColor">#000000</item>
<item name="android:textSize">17sp</item>
</style>
<style name="artist">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_alignParentBottom">true</item>
<item name="android:layout_marginLeft">6dp</item>
<item name="android:textSize">14sp</item>
<item name="android:textColor">#000000</item>
<item name="android:textStyle">italic</item>
</style>
<style name="song_group">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">0dp</item>
<item name="android:orientation">horizontal</item>
<item name="android:layout_weight">1</item>
<item name="android:padding">10dp</item>
</style>
</resources>
I am trying to define button properties on style.
My code is
<style name="button">
<item name="android:paddingTop">5dp</item>
<item name="android:paddingBottom">5dp</item>
<item name="android:textAllCaps">false</item>
<item name="colorButtonNormal">#f37022</item>
<item name="android:textColor">#ffffff</item>
</style>
And using as
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Prepaid Package"
style="#style/button"/>
But the color of the button's normal state is not changing.
This button style is only for some buttons. Not for all butons.
What to do now?
edit after question clarification
Save you style.xml in res/values/
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="custom_button" parent="#android:style/Widget.Button">
<item name="android:paddingTop">5dp</item>
<item name="android:paddingBottom">5dp</item>
<item name="android:textAllCaps">false</item>
<item name="colorButtonNormal">#f37022</item>
<item name="android:textColor">#ffffff</item>
</style>
Apply it like so:
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Prepaid Package"
style="#style/custom_button"/>
first answer
You need to inherit the parent style.
<style name="Button" parent="#android:style/Widget.Button">
<item name="android:paddingTop">5dp</item>
<item name="android:paddingBottom">5dp</item>
<item name="android:textAllCaps">false</item>
<item name="colorButtonNormal">#f37022</item>
<item name="android:textColor">#ffffff</item>
</style>
That way all your Button's that are not styled will have your custom style. i.e. no need to put in the style value.
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Prepaid Package"/>
I have a layout for a TextView and drawable as such...
<LinearLayout style="#style/dashboard_content_horizontal" >
<ImageView
style="#style/dashboard_imageview"
android:src="#drawable/menu6" />
<TextView
style="#style/dashboard_textview"
android:text="#string/menu6_text />
</LinearLayout>
as you can see the image uses a style attribute which looks like this
<style name="dashboard_imageview">
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">fill_parent</item>
<item name="android:layout_weight">1</item>
<item name="android:scaleType">fitCenter</item>
</style>
the linear layout's style surrounding it looks like this
<style name="dashboard_content_horizontal">
<item name="android:layout_width">0px</item>
<item name="android:layout_height">fill_parent</item>
<item name="android:layout_weight">3</item>
<item name="android:orientation">vertical</item>
<item name="android:layout_gravity">center</item>
<item name="android:gravity">center</item>
</style>
and TextView's style
<style name="dashboard_textview">
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:gravity">center</item>
<item name="android:textSize">20sp</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">#color/black</item>
</style>
this all works and looks exactly how I want it to look. however, because of this eclipse warning
"This tag and its children can be replaced by one
and a compound drawable" I decide to try to do this with just a TextView and drawable
like such..
<TextView
android:layout_marginTop="10dp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Menu6"
android:drawableBottom="#drawable/my_drawable"
android:padding="5dp" />
this renders the image too small.. I don't see a way to apply a style to the image to get it like I want it.. anyone know the answer? is even possible?