I have troubles making my RelativeLayout change background drawable on click. I made it clickable and focusable but this make nothing change. The background remains static to enables drawable. Thanks in advance.
<RelativeLayout
android:id="#+id/bttn_type_rl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:background="#drawable/day_bttn_bg_red"
android:clickable="true"
android:focusable="true"
android:paddingLeft="5dp"
android:paddingRight="5dp" >
<ImageView
android:id="#+id/bttn_type_iv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="5dp"
android:contentDescription="#string/app_name"
android:src="#drawable/relationship" />
<TextView
android:id="#+id/bttn_type_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/bttn_type_iv"
android:layout_centerHorizontal="true"
android:layout_marginTop="1dp"
android:text="#string/type_bttn_txt"
android:textSize="#dimen/data_fill_bttn_txt_size"
android:textStyle="bold" />
</RelativeLayout>
Here is the selector xml in drawable:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/bttn_red_p_bg" android:state_enabled="false" android:state_pressed="true"></item>
<item android:drawable="#drawable/bttn_red_a_bg" android:state_enabled="true"></item>
</selector>
Related
I created a dialog and there is a button.
I want different style of button. So I made this file and applied to the background attribute of the button.
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#color/my_pink_color">
<item
android:id="#android:id/background"
android:drawable="#drawable/btn_line_border_dialogue"></item>
</ripple>
I don't know why it has shadow around the button. It has two buttons. And the second button doesn't have any thing. When I remove the second button, the shadow seems gone.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:orientation="vertical">
<Button
android:id="#+id/btn_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:clickable="true"
android:background="#drawable/btn_ripple"
android:text="Close"
android:textAllCaps="false"
android:textColor="#color/my_text_color"
android:textSize="17sp"
android:textStyle="bold" />
<Button
android:id="#+id/btn_close2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/btn_ripple"
android:clickable="true"
android:text="Don't show this in 24hours"
android:textAllCaps="false"
android:textColor="#color/my_text_color"
android:textSize="14sp"
android:textStyle="bold" />
</LinearLayout>
When I just apply btn_line_border_dialogue.xml without the ripple. It is the same.
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#color/my_yellow" />
<stroke
android:width="1dp"
android:color="#color/my_pink" />
</shape>
How can I remove this effect?
Use style="?android:attr/borderlessButtonStyle" inside your Button
refer : https://developer.android.com/guide/topics/ui/controls/button.html#Borderless
Or If you don't need Button particularly, use TextView instead
try to set elevation t0 0 dp or you can use TextView or Layout instead of button.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:orientation="vertical">
<TextView
android:id="#+id/btn_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:clickable="true"
android:background="#drawable/btn_ripple"
android:text="Close"
android:textAllCaps="false"
android:textColor="#color/my_text_color"
android:textSize="17sp"
android:textStyle="bold" />
<TextView
android:id="#+id/btn_close2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/btn_ripple"
android:clickable="true"
android:text="Don't show this in 24hours"
android:textAllCaps="false"
android:textColor="#color/my_text_color"
android:textSize="14sp"
android:textStyle="bold" />
</LinearLayout>
This can be also fixed by setting android:stateListAnimator="#null" globally in Resources\values\styles.xml:
<?xml version="1.0" encoding="UTF-8"?>
<resources>
<style name="AppTheme" parent="AppTheme.Base">
</style>
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:buttonStyle">#style/NoShadowButton</item>
</style>
<style name="NoShadowButton" parent="android:style/Widget.Button">
<item name="android:stateListAnimator">#null</item>
</style>
</resources>
set the stateListAnimator on the button as = "#null" in the xml. It will remove the shadow from the button.
Ripple effect is not working with the below code! Using the below relative layout as item in recycler view. Building with Xamarin platform.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativelayout"
android:layout_width="fill_parent"
android:layout_height="120dp"
android:paddingBottom="1dp"
android:focusable="true"
android:clickable="true"
android:foreground="?android:attr/selectableItemBackground">
<ImageView
android:id="#+id/bugImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:src="#drawable/grey_small"
android:clickable="false"/>
<TextView
android:id="#+id/textBugName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#id/bugImage"
android:layout_alignTop="#id/bugImage"
android:layout_alignBottom="#id/bugImage"
android:gravity="left"
android:text="Klebsiella pneumoniae"
android:textColor="#ffffffff"
android:textSize="30dp"
android:layout_marginRight="145dp"
android:padding="10dp"
android:shadowColor="#000000"
android:shadowDx="0"
android:shadowDy="0"
android:shadowRadius="25"
android:clickable="false"/>
<TextView
android:id="#+id/textBugCount"
android:layout_width="135dp"
android:layout_height="wrap_content"
android:layout_alignRight="#id/bugImage"
android:layout_alignTop="#id/bugImage"
android:layout_alignBottom="#id/bugImage"
android:gravity="right"
android:text="234"
android:textColor="#ffffffff"
android:textSize="30dp"
android:padding="10dp"
android:shadowColor="#000000"
android:shadowDx="0"
android:shadowDy="0"
android:shadowRadius="25"
android:clickable="false"/>
</RelativeLayout>
I have already tried this android:foreground="?android:attr/selectableItemBackground" and it didn't work!
How to fix this? I tested it on api 22.
Not sure what you're trying to accomplish with this (i.e. setting foreground):
android:foreground="?android:attr/selectableItemBackground"
Try this:
android:background="?android:attr/selectableItemBackground"
though I use a custom drawable to have control over coloring, as shown here:
Set the background on your RelativeLayout android:background="#drawable/mybackground"
in res/drawable, mybackground.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="#color/disabledBackground" />
<item android:state_activated="true" android:drawable="#color/colorAccent" />
<item android:drawable="#color/listBackground" />
</selector>
in res/drawable-v21, mybackground.xml:
<?xml version="1.0" encoding="utf-8"?>
<ripple android:color="#color/disabledBackground" xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<selector>
<item android:state_pressed="true" android:drawable="#color/disabledBackground" />
<item android:state_activated="true" android:drawable="#color/colorAccent" />
<item android:drawable="#color/listBackground" />
</selector>
</item>
</ripple>
Here you've specified the ripple effect, supported on platforms v21+. You can adjust the colors and states to your needs, disabledBackground, colorAccent, listBackground are just examples of named color attributes
With a RelativeLayout as a root view you should set the native ripple with background="" instead of foreground=""
Or you may try to implement a cardview which will properly respond to foreground=""
android:foreground="?android:attr/selectableItemBackground"
works only for frame layout.
use
android:background="?android:attr/selectableItemBackground"
or it is better to use:
android:background="?attr/selectableItemBackground"
if you are using compat library
Just add android:onClick="add on click listener here" and android:background="?android:attr/selectableItemBackground" to your layout where you need a ripple effect. It worked for me.
I've developed a custom drawable for Switch's thumb and track but the problem is that it's appearing stretched:
Does anyone have any idea what's causing this?
My XML's are below:
Layout.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_toLeftOf="#+id/switch1"
android:padding="5dp" />
<Switch
android:id="#+id/switch1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:thumb="#drawable/switch_thumb_selector"
android:track="#drawable/switch_track_selector" />
<TextView
android:id="#+id/switchErrorView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentStart="true"
android:layout_below="#id/switch1"
android:layout_centerHorizontal="true"
android:text=""
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#android:color/holo_red_light"
android:visibility="gone" />
</RelativeLayout>
switch_thumb_selector.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/switch_thumb_inactive" android:state_pressed="true"/>
<item android:drawable="#drawable/switch_thumb_inactive" android:state_checked="true"/>
<item android:drawable="#drawable/switch_thumb_inactive"/>
</selector>
switch_track_selector.xml
<item android:drawable="#drawable/switch_track_green" android:state_checked="true"/>
<item android:drawable="#drawable/switch_track_white" android:state_checked="false"/>
<item android:drawable="#drawable/switch_track_white"/>
Green Track Drawable:
I think thats bad behavior has appeared because you didn't draw "content" area. Try this drawable, I've tested and it was working for me.
I was using the standard Android checkbox, but when I installed my app on other peoples phones for testing, the checkbox was different on each phone.
On one of the phones, the checkbox was so light you could hardly see the box when it was checked.
So I tried to make a custom checkbox checked image.
This worked ok, but I can still see the original deafult checkbox image in the background?
Any ideas why?
Here is my checkable linear layout, to be honest I'm not even sure if I need this?
<?xml version="1.0" encoding="utf-8"?>
<com.myapp.myappname.CheckableLinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<CheckBox
android:id="#+id/checkBox1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="CheckBox"
android:background="#drawable/customcheckbox"/>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</com.myapp.myappname.CheckableLinearLayout>
Then I have a custom list row which is my custom ListView:
<?xml version="1.0" encoding="utf-8"?>
<com.myapp.myappname.CheckableLinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="5dip" >
<!-- Thumbnail image -->
<LinearLayout android:id="#+id/thumbnail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:layout_alignParentLeft="true"
android:layout_marginRight="5dip">
<ImageView
android:id="#+id/list_image"
android:layout_width="60dip"
android:layout_height="60dip"
android:focusable="false"
/>
</LinearLayout>
<!-- File Name -->
<TextView
android:id="#+id/filename"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/title"
android:textColor="#343434"
android:textSize="12dip"
android:layout_marginTop="10dip"
android:layout_toRightOf="#+id/thumbnail"
android:focusable="false"
android:text="Some Text." />
<CheckBox
android:id="#+id/checkBox1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:focusable="false"
android:layout_alignParentRight="true"
android:background="#drawable/customcheckbox"
android:enabled="false" />
</RelativeLayout>
</com.myapp.myappname.CheckableLinearLayout>
Any ideas how to suppress the original?
Custom checkbox:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!--<item android:state_checked="false" android:drawable="#drawable/unchecked" />-->
<item android:state_checked="true" android:drawable="#drawable/checked" />
<!--<item android:drawable="#drawable/unchecked" /> <!– default –>-->
</selector>
The attribute you want to change is button, not background.
First, design your custom graphics for different button states. Use a state list drawable (docs) to associate the various images. For example:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="#drawable/checked" />
<item android:state_checked="false" android:drawable="#drawable/unchecked" />
</selector>
Save this into your drawable resources folder, something like my_checkbox.xml.
Now, use the button attribute on your checkbox layout definition:
<CheckBox
android:id="#+id/checkBox1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:focusable="false"
android:layout_alignParentRight="true"
android:button="#drawable/my_checkbox"
android:enabled="false" />
I have a poblem when custom progress bar. I create a animaiton drawable for progressbar. After I set this drawable for progressbar when dialog loading data show.
File anim_loading.xml
<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="#drawable/icon_loading"
android:pivotX="50%"
android:pivotY="50%" />
After I set this drawable for dialog loading data.
public void showProgressDialog(String content, boolean cancleable) {
progressDlg = ProgressDialog.show(this, "", content, true, true);
progressDlg.setIndeterminateDrawable(getResources().getDrawable(R.drawable.anim_loading));
progressDlg.setCancelable(cancleable);
progressDlg.setOnCancelListener(this);
}
But in android 2.2x or 2.3x Listview appear drawable icon_loading in row of data. I can't undestand .. :(
I attached two file (image). Correctly with android 4.0, and error with android 2.3 or 2.2
Layout row :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layoutRow"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/menu_item_selector"
android:paddingBottom="4dp"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:paddingTop="4dp" >
<TextView
android:id="#+id/txtCode"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_centerVertical="true"
android:textColor="#color/RED_COLOR"
android:textSize="25.0sp"
android:textStyle="bold" />
<RelativeLayout
android:id="#+id/layoutInfo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="3dip"
android:layout_toRightOf="#id/txtCode"
android:padding="1.0dip" >
<LinearLayout
android:id="#+id/llContent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/txtName"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:ellipsize="end"
android:singleLine="true"
android:textColor="#color/BLACK_COLOR"
android:textStyle="bold" />
<ImageView
android:id="#+id/ivFavorite"
android:visibility="gone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="3dp"
android:contentDescription="#string/app_name"
android:src="#drawable/icon_love_small" />
</LinearLayout>
<TextView
android:id="#+id/txtDetail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/llContent"
android:singleLine="true"
android:textColor="#color/BLACK_COLOR"
android:textSize="12.0sp"
android:textStyle="italic" />
</RelativeLayout>
</RelativeLayout>
Selector of row:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/SEA_BLUE" android:state_pressed="true"/>
<item android:drawable="#color/SEA_BLUE" android:state_focused="true"/>
<item android:drawable="#color/TRANSPARENT"/>
</selector>
Hope somebody help me find this bug.
Thanks so much!
p/s Sorry I hide content data in listview :)
This is a starnge problem. I just solved it but I can't explain the reason.
The point is at:
<item android:drawable="#color/TRANSPARENT"/>
You should not set the normal background of listview item to be transparent with android 2.3 or 2.2. Change the color and you will get correct result.