button for selecting gender - android

I want to have two image buttons one for men and one for women. when you select one of them, it becomes highlighted. i have written some parts of the code but i don't know what to to next. until now, it doesn't change when you click the button.
drawable/btn_selector_gender_men:
<?xml version="1.0" encoding="utf-8"?>
<selector android:exitFadeDuration="#android:integer/config_shortAnimTime"
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/ic_man_active" android:state_activated="true" />
<item android:drawable="#drawable/ic_man" />
</selector>
i have set above code as the background of my button:
<ImageButton android:id="#id/gender_man_button" android:background="#drawable/btn_selector_gender_men" android:layout_width="wrap_content" android:layout_height="wrap_content" />
another button same as above for women...
layout:
<ImageButton android:id="#id/gender_woman_button" android:background="#drawable/btn_selector_gender_women" android:layout_width="wrap_content" android:layout_height="wrap_content" />
<View android:background="#color/app_color_grayLight" android:layout_width="1.0dip" android:layout_height="fill_parent" android:layout_margin="2.0dip" />
<ImageButton android:id="#id/gender_man_button" android:background="#drawable/btn_selector_gender_men" android:layout_width="wrap_content" android:layout_height="wrap_content" />

Related

How do I set button states of a Floating Action Button using xml?

I have a floating action button in an xml below and works without errors
fragment_one.xml
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/btnFloatMain"
android:layout_width="80dp"
android:layout_height="80dp"
android:clickable="true"
android:layout_gravity="bottom|right"
android:layout_marginBottom="15dp"
android:layout_marginRight="15dp"
app:maxImageSize="80dp"
app:fabCustomSize="80dp"
app:srcCompat="#drawable/button_float_main"
/>
However I wanted to set the button states of the floating action button when pressed so I created the xml below
button_states_float_main.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="true"
app:maxImageSize="80dp"
app:fabCustomSize="80dp"
app:srcCompat="#drawable/button_float_main_pressed"/>
<item
app:maxImageSize="80dp"
app:fabCustomSize="80dp"
app:srcCompat="#drawable/button_float_main"/>
</selector>
and modified my button xml to
fragment_one.xml
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/btnFloatMain"
android:layout_width="80dp"
android:layout_height="80dp"
android:clickable="true"
android:layout_gravity="bottom|right"
android:layout_marginBottom="15dp"
android:layout_marginRight="15dp"
app:srcCompat="#drawable/button_states_float_main"
/>
but I don't think I'm setting it the right way since my app crashes now.
Use
android:drawable="#drawable/button_float_main_pressed"
instead of
app:srcCompat="#drawable/button_float_main_pressed"
in selector

Abnormal Behavior with RadioButton

I am using RadioButton in my layout. Where i have provided background to the RadioButton. Below is the code
<RadioGroup
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="horizontal">
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="#null"
android:background="#drawable/rb_spain"
android:id="#+id/am_rb_spain" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="#null"
android:background="#drawable/rb_germany"
android:layout_marginLeft="#dimen/margin_15"
android:layout_marginRight="#dimen/margin_15"
android:id="#+id/am_rb_german" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="#null"
android:background="#drawable/rb_english"
android:id="#+id/am_rb_english" />
</RadioGroup>
RadioButton background drawable
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_checked="false" android:drawable="#drawable/ic_spain" />
<item android:state_checked="true" android:drawable="#drawable/ic_spain_pressed" /> //pressed image is Large in size
<item android:drawable="#drawable/ic_spain" /> <!-- default -->
</selector>
I have saved the selection in TinyDB so that app will remember my selection whenever i open my app. But whenever i open my app the default selected RadioButton background Appears Large.
I have taken all the images of same size in drawable's with same padding.
First flag is Default selected here. But it appear to be slightly large in size
Now i have pressed 2nd flag. But first flag is not coming to its normal state.
You should change your android:button="#null" to android:button="#drawable/rb_germany" and remove background from each RadioButton. It will run fine.
Your updated RadioButton should be like:
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="#drawable/rb_spain"
android:id="#+id/am_rb_spain" />

Custom Checkbox changes its size when isChecked is true Android?

I have an single choice ExpandableListView with a custom checkbox defined by a Drawable I created in the Android Asset Studio.
For some reason, when the checkbox is checked it looks smaller than when it is not. I already checked if I made a mistake with the size of the images and they all have the same size. (disabled or enabled).
Here's the code of my custom checkbox:
drawable/custom_checkbox.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/ic_success_enabled" android:state_checked="true" android:state_focused="true"/>
<item android:drawable="#drawable/ic_accept_disabled" android:state_checked="false" android:state_focused="true"/>
<item android:drawable="#drawable/ic_accept_disabled" android:state_checked="false"/>
<item android:drawable="#drawable/ic_success_enabled" android:state_checked="true"/>
</selector>
My drawable/ic_success_enabled & disabled are:
The rows for each element in the ExpandableListView
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="5dp" >
<TextView
android:id="#+id/title_one_item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="false"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/one_item_checkbox"
android:layout_toRightOf="#+id/one_item_row_image"
android:padding="10dp"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/akdemia_0_black" />
<com.akdemia.application.CircularImageView
android:id="#+id/one_item_row_image"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentLeft="false"
android:layout_alignParentTop="false"
android:layout_centerVertical="true"
android:src="#drawable/placeholder_icon_iphone" />
<CheckBox
android:id="#+id/one_item_checkbox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:background="#drawable/akdemia_checkbox"
android:button="#null"
android:focusable="false" />
</RelativeLayout>
And here is a screen shot of the ExpandableListView, where you guys can see the problem: (All the orange rectangles where added on purpose, just ignore them)
Hope anyone can help me with this, thanks in advance!
Give your checkbox a layout width and height like this:
android:layout_width="25dp"
android:layout_height="25dp"

Change the Color of RadioButton When Clicked

I have a RadioGroup having 3 Radio Buttons. By default , when I click the radio button, it turns Blue. I need to change the color, say , when I click the first one, it should turn to Yellow, the 2nd one Blue and the 3rd one to Green.
I have seen some tutorials to customize by styling the radio buttons, like Is it possible to change the radio button icon in an android radio button group but it hides all the buttons.
Here is my XML .
<RadioGroup
android:id="#+id/radioGroup1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/studentImage"
android:layout_alignParentRight="true"
android:layout_alignRight="#+id/studentImage"
android:layout_alignTop="#+id/studentImage"
android:orientation="horizontal" >
<RadioButton
android:id="#+id/rb1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="visible" />
<RadioButton
android:id="#+id/rb2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="visible" />
<RadioButton
android:id="#+id/rb3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="visible" />
</RadioGroup>
You can use a statelist drawable like I wrote below:
<?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/color_pressed" /> <!-- pressed -->
<item android:drawable="#drawable/default_button" /> <!-- default -->
</selector>
color_pressed and deafult_button would be your drawables for each button's state, you could have multiple selectors for each radio button

Making buttons that look like tabs in android

I want this kind of look. They don't seem like tabs so I believe they are buttons.
I am able to acheive the similar type with toggle button by keeping a selector in drawable.
<ToggleButton
android:id="#+id/toggleButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#drawable/custom_selector"
android:textOn=" Button1 Button2"
android:textOff=" Button1 Button2" />
But they have only two values and by clicking on the selected tab gets the other selected and the present one unselected. But I want exactly like tab. So can someone please help me achieve it? Thanks in advance.
You have to create selector for all button and use RadioGroup with selector background and null button..
Follow #Andru answer for create Selector..
Below is RadioGroup code.
<RadioGroup
android:id="#+id/rdogrp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:gravity="center"
android:orientation="horizontal" >
<RadioButton
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="0dp"
android:background="#drawable/btn1Selector"
android:button="#null"
android:checked="true"
android:gravity="center" />
<RadioButton
android:id="#+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="0dp"
android:background="#drawable/btn2Selector"
android:button="#null"
android:gravity="center" />
<RadioButton
android:id="#+id/btn3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="0dp"
android:background="#drawable/btn3Selector"
android:button="#null"
android:gravity="center" />
<RadioButton
android:id="#+id/btn4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="0dp"
android:background="#drawable/btn4Selector"
android:button="#null"
android:gravity="center" />
</RadioGroup>
here is sample code for btn1Selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/btn1_selected" android:state_checked="true" />
<item android:drawable="#drawable/btn1_normal" android:state_checked="false"/>
</selector>
you can do something like this, instead of toggle button use normal buttons.
if "Data" button clicked do like this
data(View v)
{
databtn.setBackgroundResource(R.drawable.image1);
w_chartbtn.setBackgroundResource(R.drawable.image2);
H_chartbtn.setBackgroundResource(R.drawable.image2);
}
if "H-chart" button clicked
H_chart(View v)
{
databtn.setBackgroundResource(R.drawable.image2);
w_chartbtn.setBackgroundResource(R.drawable.image2);
H_chartbtn.setBackgroundResource(R.drawable.image1);
}
Use simple button instead of toogle button. And set background like this:
I am giving example for 1 button:
android:background="#drawable/data_button_select_state"
And add a xml file in your 'drawable' folder named data_button_select_state:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/data_image_selected_state"
android:state_selected="true" />
<item android:drawable="#drawable/data_image_selected_state"
android:state_pressed="true" />
<item android:drawable="#drawable/data_image_without_selected" />
</selector>
Now add code in java file like this:
when data button clicked:
data_button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
data_button.setActivated(true);
H_chart_button.setActivated(false);
w_chart_button.setActivated(false);
hc_chart_button.setActivated(false);
}
});
change other button like this as well. This will might help you...

Categories

Resources