On an Android View, I want to have a some clickable text that works similar to a webpage hyperlink.
It looks just like normal text (no button border), but when touched, I want the text color to change and I may also want its background to turn a reverse color.
Is it better to use a Button with a transparent background or a TextView. When should I choose one over the other?
Thanks much
you can use Button and make selector for background and text both.
textselector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:color="#0000ff"/> <!-- pressed -->
<item android:state_focused="true" android:color="#android:color/white"/> <!-- focused -->
<item android:color="#android:color/white"/> <!-- default -->
</selector>
buttonselector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:color="#android:color/white"/> <!-- pressed -->
<item android:state_focused="true" android:color="#0000ff"/> <!-- focused -->
<item android:color="#0000ff"/> <!-- default -->
</selector>
In your layout xml
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/buttonselector"
android:text="some text"
android:textColor="#drawable/textselector" />
hotveryspicy gave a great answer and really pointed me in the right direction. Thank you, but I had a few issues with the response.
What I want is a button that has Black text and a Gray background in its normal state and a Red background with White text in its selected state. Like this:
Using hotveryspicy's suggestions I had the following issues:
I get an error when trying to assign a drawable to textColor. Funny but I see other references to doing this sort of thing. Maybe the XML validation is stricter now?
I also got an error if I didn't define a android:drawable in the buttonselector.xml. It seems you can set the color of a drawable in a selector eiter, you need to actually create a drawable.
Anyhow this is what I did:
I created a Color State Resource that looks like this:
File: res/colors/link_button.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:color="#ffffff"/>
<item android:color="#000000"/>
</selector>
Then the following 3 drawables:
My button background in its normal state using a Shape Drawable:
File: res/drawable/link_button.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#cccccc"/>
</shape>
My button background in its selected state, also a Shape Drawable:
File: res/drawable/link_button_selected.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#ff0000"/>
</shape>
Then I created a Drawable Selector that chooses between the 2 shapes.
File: res/drawable/link_button_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#drawable/link_button_selected"
android:state_pressed="true" />
<item
android:drawable="#drawable/link_button" />
</selector>
Then in my layout my button looks like this:
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="Button"
android:textColor="#color/link_button"
android:background="#drawable/link_button_selector"
/>
Thanks for the help everyone!
Add String like
<string name="link">'Google'</string>
In your layout
<TextView
android:id="#+id/link"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autoLink="all"
android:linksClickable="true"
android:text="#string/link" />
You can linkify your text using the linkify class.
Have a look at this and this with few examples
For Google's sake:
Rather than make a button look like a link why not make a TextView clickable? This was effectively what I wanted and worked for my use. I wanted text to be clickable to spawn an intent.
TextView.setOnClickListener(new View.OnClickListener()
Related
Here is a layer-list:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#color/blue"/>
<item
android:drawable="#mipmap/ic_launcher_foreground"
android:gravity="center"/>
</layer-list>
How do I set the size of the second item? In some devices, it just stretches across the entire screen. I can't use android:width and android:height cause they're for API 23 minimum. I tried adding a <shape> item above it like in this answer here: https://stackoverflow.com/a/46115699/14536109 but it still stretched across the entire screen like before.
How about adding pixels to the item?
<item
android:drawable="#mipmap/ic_launcher_foreground"
android:gravity="center"
android:top="dimension"
android:right="dimension"
android:bottom="dimension"
android:left="dimension"/>
Try this maybe it will work.
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:left="16dp"
android:right="0dp"
android:top="0dp"
android:bottom="16dp"
/>
</layer-list>
Here's what I have :
Buttonshape.xml :
<?xml version="1.0" encoding="utf-8"?><layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#FF008AB8"/>
<stroke android:color="#0299D0"/>
<corners android:radius="15dp"/>
</shape>
</item>
<item android:drawable="#drawable/b_popcorn"></item></layer-list>
BlueFragment.xml :
<Button
android:id="#+id/BtePlay" ...
android:background="#drawable/Buttonshape"
/>
Everything is working greate, my button corner is rounded and it apply the drawable, but I have a question :
Is it possible to add more items in my buttonshape.xml and select a specific drawable in my BlueFragment.xml
For example doing something like this :
Buttonshape.xml :
...
<item android:drawable="#drawable/b_popcorn"></item></layer-list>
<item android:drawable="#drawable/b_2"></item></layer-list>
and in my BlueFragment.xml :
<Button
android:id="#+id/BtePlay" ...
android:background="#drawable/Buttonshape|b_popcorn"
/>
<Button
android:id="#+id/BtePlay2" ...
android:background="#drawable/Buttonshape|b_2"
/>
Something like this to set only one drawable for each button instead of making 50+ xml files for each buttons ...
Thanks
we have only option that is using selector, but its only depend on view state
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/bg_checked" android:state_checked="true"/>
<item android:drawable="#drawable/bg_unchecked" android:state_checked="false"/>
</selector>
so I think we can not do any thing like you expected, so sorry for that !
I have a custom switch. I want the text (on/off) to be in the track and not in the thumb.
I was thinking of setting a selector with text in drawable and setting it as track of the switch. But I cannot set text in a shape. Any ideas how I can do this?
I also want to add some padding to the track, I dont want the thumb to touch the track.
This is kind of how I want it to look:
This is the shape of my track:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
android:visible="true"
android:useLevel="false">
<corners
android:radius="20dp" />
<size
android:width="48dp"
android:height="21dp" />
<stroke
android:color="#bfbfbf"
android:width="6dp"/>
Switch off screenshot
Switch on screenshot
Switch on image
Switch off image
Thumb image
switch_on_off.xml
<?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/on_switch"/>
<item android:state_checked="false" android:drawable="#drawable/off_switch"/>
<item android:drawable="#drawable/off_switch"/>
</selector>
xml code
<android.support.v7.widget.SwitchCompat
android:id="#+id/switch_compat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="20dp"
app:track="#drawable/switch_on_off"
android:thumb="#drawable/on_switch_active"/>
Try above code and let me know if you find any error.....
I have created custom floating button and use all library but not created custom floating button i have very tried to make to this button if you any idea how to make custom floating button.
Plz help me
My button look like this:
My code
<Button
android:id="#+id/btn_build_now"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="0"
android:background="#color/Background_Main"
android:drawableBottom="#drawable/button_bg"
android:paddingBottom="10dp" />
You could simply use Android support library to create a Floating Action Button.
For example here is a floating action button example with custom background color, pressed and focused states.
XML
<android.support.design.widget.FloatingActionButton xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/fb"
android:layout_width="60dp"
android:layout_height="60dp"
android:src="#drawable/fb_icon_play"
app:backgroundTint="#drawable/fb_play_bg" />
fb_icon_play.xml in Drawable Folder
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="#drawable/floating_button_blue_play_icon_pressed" />
<item android:state_focused="true" android:drawable="#drawable/floating_button_yellow_play_icon_pressed" />
<item android:drawable="#drawable/floating_button_yellow_play_icon_pressed" />
</selector>
fb_play_bg.xml in Drawable Folder
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_pressed="false" android:color="#3389b3"/>
<item android:state_focused="true" android:state_pressed="true" android:color="#3389b3" />
<item android:state_focused="false" android:state_pressed="true" android:color="#d1930f" />
<item android:color="#3389b3" />
</selector>
Here is another tutorial for creating a custom FloatingActionButton.
You can use the new version of FAB, Extended FAB in XML
The old one
<com.google.android.material.floatingactionbutton.FloatingActionButton/>
The newest:
<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton/>
then you can define Icon, Text and Shape:
android:text="Hi"
app:icon="#android:drawable/ic_media_play"
app:shapeAppearance="#style/ShapeAppearanceOverlay.Material3.FloatingActionButton"
app:shapeAppearanceOverlay="null"
I set up a color statelist like so:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#color/white_25percent_opacity" android:state_selected="true"/>
<item android:color="#color/white_25percent_opacity" android:state_pressed="true"/>
<item android:color="#color/white_25percent_opacity" android:state_focused="true"/>
<item android:color="#android:color/white"/>
</selector>
Then I tried to set it in the xml for a recyclerview item like so:
<TextView
android:id="#+id/myTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:layout_centerHorizontal="true"
android:textSize="18sp"
android:paddingLeft="10dp"
android:paddingStart="10dp"
android:paddingRight="10dp"
android:paddingEnd="10dp"
android:textColor="#color/mySelector"
/>
but it doesnt work - the color doesnt change when pressed. So I tried to set it programmatically in onBindViewHolder like this:
viewHolder.myTextView.setTextColor(ContextCompat.getColorStateList(context, R.color.mySelector));
and I also tried like this:
viewHolder.myTextView.setTextColor(ContextCompat.getColor(context, R.color.mySelector));
which also don't work. Where is the mistake here and why doesn't this work for recyclerviews? To clarify - the text is shown in the initial color (white) but doesn't change to the pressed color.
Edit: also tried to solve it by making the selector a drawable - but it didn't work:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/white_25percent_opacity" android:state_selected="true"/>
<item android:drawable="#color/white_25percent_opacity" android:state_pressed="true"/>
<item android:drawable="#color/white_25percent_opacity" android:state_focused="true"/>
<item android:drawable="#android:color/white"/>
</selector>
If I set an ontouchlistener and switch the colors manually then it works properly - but I want to do this with a statelist.
Hi Implement your XML like the below code , Hope it would be helpful may be the issue is you have given both state_pressed and state_selected = true.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Color when the row is selected -->
<item android:drawable="#android:color/darker_gray" android:state_pressed="false" android:state_selected="true" />
<!-- Standard background color -->
<item android:drawable="#android:color/white" android:state_selected="false" />
</selector>
Turns out I needed to set this on the textview to make it work:
android:clickable="true"