i am trying to show rounded shadow in center when status is pressed.
but it is giving full view (rectunglar) shadow in current case.
here is what i am trying...
1. left_button.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<shape >
<solid android:color="#ffffff"></solid>
</shape>
</item>
<item android:state_focused="true"><shape>
<solid android:color="#40454a"></solid>
</shape></item>
<item><shape>
<solid android:color="#40454a"></solid>
</shape></item>
</selector>
here is the xml layout where i am applying ...
<RelativeLayout
android:id="#+id/relative_activity_camera_bottom"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:gravity="center_vertical"
android:background="#layout/footer_color" >
<LinearLayout
android:id="#+id/bottom_layout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:background="#android:color/transparent"
android:gravity="center_vertical"
android:weightSum="1.0" >
<ImageView
android:id="#+id/captureImage"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="0.5"
android:background="#layout/left_button"
android:src="#layout/camera_image"
/>
<ImageView
android:id="#+id/recordButton"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="0.5"
android:src="#layout/videocamera_image"
android:background="#layout/left_button"
android:onClick="startRecording"
/>
</LinearLayout>
</RelativeLayout>
original condition-
current case- (but i want to show white only in center)
For example, use a selector :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/gradient_round_press_effect" android:state_selected="true" android:state_window_focused="false"/>
<item android:drawable="#drawable/gradient_round_press_effect" android:state_selected="true"/>
<item android:drawable="#drawable/gradient_round_press_effect" android:state_pressed="true" android:state_selected="false"/>
<item android:drawable="#drawable/gradient_round_press_effect_inverse" android:state_selected="false"/>
</selector>
With two drawable shapes, the first when clicked (gradient_round_press_effect):
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<gradient
android:endColor="#color/clr_the_color_behind"
android:gradientRadius="130"
android:startColor="#66000000"
android:type="radial" />
</shape>
Adapt the size of the radius with the size of the button
For start color use #66FFFFFF if you want white (66 is for the transparency)
For end color maybe you can use transparent ? i didn't try this
and when not clicked define your own colors (gradient_round_press_effect_inverse) not really "inverse" but this is an example of another gradient. You can just use a color instead
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<gradient
android:angle="270"
android:centerColor="#color/clr_gradient2"
android:endColor="#color/clr_gradient1"
android:startColor="#color/clr_gradient3"
android:type="linear" />
</shape>
Related
Create a login page. but I don't know what problem this code
login button don't work change color when I clicked!
I want to when I click then change color button
why doesn't changed that 'LOGIN' button?
how I can solve this?
activity_login.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="16dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginBottom="16dp"
android:background="#drawable/btn_login"
android:clickable="true"
android:gravity="center"
android:paddingLeft="32dp"
android:paddingRight="32dp">
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="#drawable/icon_user" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="LOGIN"
android:textColor="#fff"
android:textSize="16dp" />
</LinearLayout>
</LinearLayout>
selector xml ->
btn_login.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="true">
<shape android:shape="rectangle">
<solid android:color="#4DAEEA" />
<corners android:radius="30dp" />
</shape>
</item>
<item android:state_pressed="true">
<shape android:shape="rectangle">
<solid android:color="#00ff00" />
<corners android:radius="30dp" />
</shape>
</item>
<item android:state_enabled="false">
<shape android:shape="rectangle">
<solid android:color="#999" />
<corners android:radius="30dp" />
</shape>
</item>
</selector>
you should make LinearLayout behave like a button by adding style and removing background , follow these steps
<LinearLayout
......
style="#style/btn_stand"
.......
>
</LinearLayout>
My style definition for the button:
<style name="btn_stand" parent="AppBaseTheme">
<item name="android:background">#drawable/btn_stand_sel</item>
<item name="android:textColor">#drawable/btn_stand_text_color</item>
<item name="android:minHeight">48dp</item>
<item name="android:paddingLeft">5dp</item>
<item name="android:paddingRight">5dp</item>
</style>
My #drawable/btn_stan_sel file:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- disabled state -->
<item android:drawable="#drawable/btn_stand_disabled" android:state_enabled="false"/>
<!-- enabled and pressed state -->
<item android:drawable="#drawable/btn_stand_pressed" android:state_enabled="true" android:state_pressed="true"/>
<!-- enabled and focused state -->
<item android:drawable="#drawable/btn_stand_focused" android:state_enabled="true" android:state_focused="true"/>
<!-- enabled state -->
<item android:drawable="#drawable/btn_stand_enabled" android:state_enabled="true"/>
</selector>
My drawable file repeated for each state just with different colors for each state:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<stroke
android:width="1dp"
android:color="#color/stroke" />
<solid android:color="#color/blue" />
<corners android:radius="6dp" />
</shape>
this was an example that works for me , hope you use it and choose the color you want
Add android:focusable="true"to your linear layout xml code.
In the event that that doesn't work, you can try to replace android:background=#drawable/btn_login with android:foreground="?android:attr/selectableItemBackground".
In my application I want to give border to my Radio Button with text.
<RadioButton
android:id="#+id/radioAndroid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:button="#drawable/inout_radio_button"
android:checked="true"
android:gravity="center"
android:padding="5dp"
android:layoutDirection="rtl"
android:layout_marginRight="#dimen/margin_20dp"
android:layout_marginLeft="#dimen/margin_20dp"
android:text="1"
android:textColor="#color/color_radio_text" />
<RadioButton
android:id="#+id/radioiPhone"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:button="#drawable/inout_radio_button"
android:gravity="center"
android:padding="5dp"
android:layoutDirection="rtl"
android:layout_marginRight="#dimen/margin_20dp"
android:layout_marginLeft="#dimen/margin_20dp"
android:text="2"
android:textColor="#color/color_radio_text" />
I have put icon as below:
inout_radio_button.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="#drawable/radioact" ></item>
<item android:state_checked="false" android:drawable="#drawable/radio" />
</selector>
But, i can't find way to give border around radio button.
Apply background parameter to the RadioButton directly (no need to surround it with external layout):
android:background="#drawable/background"
Where the background looks like:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape
android:shape="rectangle">
<stroke
android:width="1px"
android:color="#android:color/black"/>
<corners android:radius="5dp"/>
</shape>
</item>
</layer-list>
Also apply the padding to the each of check mark images:
Inactive:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#drawable/radio"
android:left="6dp"
android:right="6dp"/>
</layer-list>
Active:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#drawable/radioact"
android:left="6dp"
android:right="6dp"/>
</layer-list>
And selector:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/active" android:state_checked="true"/>
<item android:drawable="#drawable/inactive" android:state_checked="false"/>
</selector>
Use a Layout around your RadioButton and set a backgroundDrawable with a custom border
create border.xml and put it into drawable
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<stroke
android:width="1dip"
android:color="#android:color/black" />
<corners android:radius="10dp"/>
</shape>
and then use it in your Layout
<RelativeLayout
android:background="#drawable/border">
// your radiogroup
</RelativeLayout>
I would like to change the background color of my ImageButton on pressed event.
Here is what i am done :
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<solid android:color="#color/rose_normal" />
<solid
android:state_pressed="true"
android:color="#color/rose_fonce" />
<stroke
android:width="1sp"
android:color="#color/rose_fonce" />
</shape>
My button is well in "rose_normal" color, but never in "rose_fonce" color on press.
Where is the problem ?
EDIT : PROBLEM SOLVED :
Create one xml file called background_rounded_button.xml :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/rounded_button_rose_fonce" android:state_selected="true"></item>
<item android:drawable="#drawable/rounded_button_rose_fonce" android:state_pressed="true"></item>
<item android:drawable="#drawable/rounded_button_rose_normal"></item>
</selector>
rounded_button_rose_fonce.xml :
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<solid android:color="#color/rose_fonce" />
<stroke
android:width="1sp"
android:color="#color/rose_fonce" />
</shape>
rounded_button_rose_normal.xml :
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<solid android:color="#color/rose_normal" />
<stroke
android:width="1sp"
android:color="#color/rose_fonce" />
</shape>
And finally, apply background for the button :
<ImageButton
android:id="#+id/all_annonce_button_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/background_rounded_button.xml"
android:padding="16dp"
android:src="#drawable/ic_action_search" />
The problem is that you are not using a selector, but a shape.
Try this code (button_selector.xml, put it in your drawable folder):
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/rose_fonce" android:state_selected="true"></item>
<item android:drawable="#color/rose_fonce" android:state_pressed="true"></item>
<item android:drawable="#color/rose_normal"></item>
</selector>
When setting this selector as the background of a Button, it will have the "rose_normal" color in normal state, and the "rose_fonce" color when pressed or selected.
Example:
<Button
android:background="#drawable/button_selector" />
I want to set the background of my layout to semi-transparent color with top border (not transparent) on it. I tried to achieve this. Currently my drawable file looks like the following:
<?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="#FF0000FF" />
</shape>
</item>
<item android:top="5dp">
<shape>
<solid android:color="#7F000000" />
</shape>
</item>
</layer-list>
But in this xml the semi-transparent shape goes on the non-transparent shape, so in the result it isn't semi-transparent at all. Can you please help me to get the background I want?
Thanks in advance.
After searching the web and trying to find the right solution, finally I've got the answer from the guys in the chat. The solution is to create one more layout on top of the first one and for example give it a height of 10dp and the width of match_parent.
Here is the working example:
activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/MainLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/main_bg"
android:orientation="vertical"
android:padding="5dp"
tools:context=".MainActivity" >
<LinearLayout
android:id="#+id/Box"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/background"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/Border"
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_weight="0.64"
android:background="#drawable/border"
android:orientation="vertical"
tools:ignore="InefficientWeight" >
</LinearLayout>
<TextView
android:id="#+id/Content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.64"
android:padding="5dp"
android:text="#string/example"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/white" />
</LinearLayout>
</LinearLayout>
main_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:top="5dp">
<shape>
<solid android:color="#FF990000" />
</shape>
</item>
</layer-list>
background.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:top="5dp">
<shape>
<solid android:color="#55000000" />
</shape>
</item>
</layer-list>
border.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:top="5dp">
<shape>
<solid android:color="#FFFF0000" />
</shape>
</item>
</layer-list>
strings.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">Transparent Views</string>
<string name="action_settings">Settings</string>
<string name="hello_world">Hello world!</string>
<string name="example">Content …</string>
<color name="white">#FFFFFFFF</color>
</resources>
Hope it will be helpful for someone else too.
Here is one simple solution.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:left="-5dp" android:bottom="-5dp" android:right="-5dp">
<shape android:shape="rectangle">
<stroke android:width="5dp" android:color="#color/borderColor" />
<solid android:color="#color/backgroundColor" />
</shape>
</item>
</layer-list>
I have an ImageButton and a LinearLayout wrapping that button, like this:
<LinearLayout
android:id="#+id/homeButtonLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/p_buttons_background"
android:orientation="vertical" >
<ImageButton
android:id="#+id/homeButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10px"
android:background="#drawable/home_icon"
android:onClick="goBackToCameraScreen" />
</LinearLayout>
I put a background around the ImageButton in the LinearLayout, as you can see above.
I want to be able to change that background (that is, the background of the LinearLayout, not the background of the ImageButton) when the user clicks on the ImageButton. I could do that programmatically, but I want to do that via XML. I could easily change the background of the ImageButton by writing a selector, like this:
<?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/button_pressed" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/button_focused" /> <!-- focused -->
<item android:drawable="#drawable/button_normal" /> <!-- default -->
</selector>
That's EXACTLY what I want, except that I want to change the LinearLayout background, and not the ImageButton background. How can I create a XML selector just like the one above, but that actually changes the background of the LinearLayout instead of the ImageButton background??
Thank you in advance!! =)
Set the selector to your LinearLayout and add android:descendantFocusability="blocksDescendants" to it.
In selector, replace all button backgrounds with layout backgrounds.
<LinearLayout
android:id="#+id/homeButtonLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/layout_bg_selector"
android:orientation="vertical"
android:descendantFocusability="blocksDescendants">
<ImageButton
android:id="#+id/homeButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10px"
android:background="#drawable/home_icon"
android:onClick="goBackToCameraScreen" />
</LinearLayout>
selector layout_bg_selector.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="#F0F0F0" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#00F000" /> <!-- focused -->
<item android:drawable="#0000F0" /> <!-- default -->
</selector>
I think the questioner is dead by now :XD
but this is the solution
add this two lines of code to your layout:
android:clickable = "true"
and
android:focusable = "true"
the main sample is
we have this constraint layout like :
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/layoutSample"
android:layout_width="150dp"
android:layout_height="120dp"
android:background="#drawable/layout_selector"
android:clickable="true"
android:focusable="true">
</androidx.constraintlayout.widget.ConstraintLayout>
and the ( layout_selector.xml ) like this :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/bg_pressed" android:state_pressed="true" /> <!-- pressed -->
<item android:drawable="#drawable/bg_focused" android:state_focused="true" /> <!-- focused -->
<item android:drawable="#drawable/bg_default" /> <!-- default -->
</selector>
and for ( bg_pressed.xml ) and ( bg_focused.xml ) and ( bg_default.xml ) as we used in selector before we need to declare them in drawable folder like :
bg_pressed.xml :
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="8dp" />
<solid android:color="#ffffff" />
<stroke
android:width="2dp"
android:color="#00ff00" />
</shape>
bg_focused.xml :
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="8dp" />
<solid android:color="#ffffff" />
<stroke
android:width="2dp"
android:color="#ff0000" />
</shape>
bg_default.xml :
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="8dp" />
<solid android:color="#ffffff" />
</shape>
now put your image view or something else inside the layout and try
some clicks :) (read the question!)
hope this will help you ...