Custom Checkbox changes its size when isChecked is true Android? - 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"

Related

Clickable icon on image

I want to add a clickable “favorite icon ❤️“ on the top of the ImageView for an Android project. I found similar to this in Zillow application as in the attached image. Any help please?
image from Zillow
use checkbox for this, use 2 icon one is favorite (full heart) and the other is an unfavourite icon(heart with the only border) and set In the selector
set selector file in android:button property in the check box
<androidx.appcompat.widget.AppCompatCheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="#drawable/selector_checkbox"/>
Here is the selector file,
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true"
android:drawable="#drawable/checkbox_favorite" />
<item
android:state_checked="false"
android:drawable="#drawable/checkbox_unfavourite" />
</selector>
Follow this code ,
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="center"// your scale image on your need!
android:src="your_image" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_baseline_favorite_24"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:clickable="true"// doesnt need just hard code like setOnClick...
android:layout_alignParentEnd="true"
android:layout_margin="16dp"/>
</RelativeLayout>

ImageView is not highlighting on click

I am designing an app for multiple devices.In that I am using a imageview and using selector i am setting the background image depends on the state.I works fine for all the devices except only one 10 inch device.
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true" >
<LinearLayout
android:layout_width="145dp"
android:layout_height="239dp"
android:layout_marginRight="6dp"
android:background="#drawable/common_selector_thumbnail_shadow_title_background"
android:gravity="center"
android:orientation="vertical"
android:paddingLeft="5dp"
android:paddingRight="5dp" >
<FrameLayout
android:layout_width="130dp"
android:layout_height="186dp"
android:layout_marginTop="5dp"
android:background="#color/RGB_100_215_216_217" >
<ImageView
android:id="#+id/seasonal_favorites_default_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="center"
android:src="#drawable/tw_noitem_movie" />
</FrameLayout>
<TextView
android:id="#+id/seasonal_favorites_list_text"
android:layout_width="140dp"
android:layout_height="43dp"
android:duplicateParentState="true"
android:ellipsize="end"
android:gravity="center_vertical"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:singleLine="true"
android:textColor="#drawable/common_selector_thumbnail_shadow_title_textcolor"
android:textSize="18dp" />
</LinearLayout>
</FrameLayout>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/thumbnail_title_bg_focus" android:state_focused="true" android:state_pressed="true"/>
<item android:drawable="#drawable/thumbnail_title_bg_focus" android:state_pressed="true"/>
<item android:drawable="#drawable/thumbnail_title_bg_focus" android:state_focused="true"/>
<item android:drawable="#drawable/thumbnail_title_bg"/>
</selector>
Thanks in advance.
Probabilly you have to put in your manifest file: hardwareAccelerated="true"
Try that and let me know if it worked!
Use ImageButton there are two methods setBackgroundResource, setImageResource to set resources for button(which one will be pressed) and for image itself
You need to add android:clickable="true" to the LinearLayout or set a OnClickListener there. Otherwise your selector background does not get activated.
Use ImageButton instead of ImageView to get the selector work.
If you can provide the different states of the image then see this
post
Otherwise...
Use a LayerDrawable for the image source. One layer is the actual image, the other layer is a state list selector.
LayerDrawable d = new LayerDrawable(new Drawable[]{getResources().getDrawable(R.drawable.my_image), getResources().getDrawable(R.drawable.my_selector_list)});
imageView.setImageDrawable(d);
Or you can define a layer drawable XML resource and use that in your layout XML.

Why spinner is so big?

I'm developing an Android application and I have a problem with designing layouts:
With this layout:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp" >
<TextView
android:id="#+id/textUploadPhotos"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.4"
android:text="#string/layout_upload_photos"
android:textAppearance="?android:attr/textAppearanceMedium" />
<Spinner
android:id="#+id/spinUploadPhotos"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.7"
android:background="#drawable/spin_selector" />
</LinearLayout>
And the spin_selector.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/select" android:state_pressed="true"/>
<item android:drawable="#drawable/select" android:state_focused="true"/>
<item android:drawable="#drawable/select"/>
</selector>
I get this:
#drawable/select is this one:
How can set spinner size to #drawable/select height?
Use 9 patch as background of your spinner. I think this will be interesting for you: http://adanware.blogspot.com/2012/03/android-custom-spinner-with-custom.html
You image seems to be the culprit. If you can't use a 9-patch png, try setting the height attribute of the spinner to a better value. Perhaps, right now, you have set it to wrap_content.
Or, may be you can try reducing the height of the image itself.

On hover not working properly on Relative Layout Android [duplicate]

This question already has an answer here:
How to change color of the text in TextView on hover like in css?
(1 answer)
Closed 9 years ago.
I trying to change the color of by background on android:state_hovered.But it is not reflecting any changes on my application.Now what i want to when the relative layout get focused i want to change it's background and the that time i want to change the color of my Text View Text .But this code is not working for me please suggest me the changes
this is my XML file:
<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" >
<ImageView
android:id="#+id/imgLogo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginRight="5dip"
android:padding="3dip"
android:src="#drawable/logo_demo" />
<RelativeLayout
android:id="#+id/flight_relative"
android:layout_width="match_parent"
android:layout_height="70dp"
android:layout_below="#+id/imgLogo"
android:layout_marginTop="5dp"
android:background="#drawable/button_effect"
android:gravity="center_vertical" >
<ImageView
android:id="#+id/flight_list_image"
android:layout_width="50dip"
android:layout_height="50dip"
android:layout_alignParentLeft="true"
android:layout_marginRight="5dip"
android:padding="3dip"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/flight_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/flight_list_image"
android:layout_marginRight="5dp"
android:layout_marginTop="10dp"
android:layout_toLeftOf="#+id/flight_arrow"
android:layout_toRightOf="#+id/flight_list_image"
android:text="#string/flight_tittle"
android:textColor="#drawable/text_color"
android:textStyle="bold"
android:textSize="15dp"
/>
<TextView
android:id="#+id/content_flight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/flight_content"
android:layout_marginRight="5dp"
android:layout_toLeftOf="#+id/flight_arrow"
android:layout_toRightOf="#+id/flight_list_image"
android:text="#string/flight_content"
android:textColor="#2f2f2f"
android:textSize="10dp" />
<ImageView
android:id="#+id/flight_arrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/flight_content"
android:layout_alignParentRight="true"
android:src="#drawable/arrow" />
</RelativeLayout>
</RelativeLayout>
This is my style file that is button_effect.xml to change the background of my relative layout.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#android:color/darker_gray" android:state_hovered="true"></item>
<item android:drawable="#drawable/gray_bg"></item>
</selector>
This is my text_color.xml to change the color of the text.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:color="#177f75"/>
<item android:color="#152b72"/>
</selector>
You can do something like this, for textview as well as with your layout.
Here I have used drawables for different state when - pressed, hovered and normal.
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/book_press" android:state_pressed="true"/> <!-- pressed -->
<item android:drawable="#drawable/book_focused" android:state_focused="true"/> <!-- focused -->
<item android:drawable="#drawable/book_default"/> <!-- default -->
</selector>
Instead of drawables use your color. Hope this will help you.
And you can set layout focused using xml for using Java code.
use this for changing text color on hover
textview.setOnTouchListener(new OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
if(event.getAction() == MotionEvent.ACTION_DOWN){
//Button Pressed
}
if(event.getAction() == MotionEvent.ACTION_UP){
//finger was lifted
}
return false;
}
});

Set background for item in list view

I am working with list view in android.
I want to set background color for each item in list view.
If I use setbackgroudcolor function, it displays incorrect color. It seems there is the mix color of application background and new color.
If I use setbackgroundresource fund, it displays ok. However, when I click on an item, color is not change.
i need to set background for for each item on list view, and when click on an item, background is changed to other color or background
My code: OnView
// Set background
RelativeLayout root = (RelativeLayout) vi.findViewById(R.id.p60001_layout_info);
if (position % 2 == 0){
root.setBackgroundResource(R.drawable.cell_g_02);
//root.setBackgroundColor(R.color.color_fist_in_pack_view);
}else{
root.setBackgroundResource(R.drawable.cell_g_01);
//root.setBackgroundColor(R.color.color_fist_in_pack_view);
}
Row layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/p60001_layout_info"
android:layout_width="match_parent"
android:layout_height="30dp">
<TextView
android:id="#+id/p60001_item_info"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:textSize="15dp" android:layout_marginLeft="10dp" android:fadeScrollbars="false" android:textColor="#color/txt_normal" android:scrollHorizontally="true" android:gravity="center_vertical">
</TextView>
<ImageView
android:id="#+id/icon"
android:layout_width="22px"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:src="#drawable/arrow" android:layout_marginRight="15dp"/>
<ImageView
android:id="#+id/p60001_image_notice_num"
android:layout_width="wrap_content"
android:layout_height="25dp"
android:layout_alignParentTop="true"
android:layout_marginRight="30dp"
android:layout_toLeftOf="#+id/icon"
android:layout_marginTop="5dp" android:src="#drawable/fukidashi" android:visibility="invisible" android:clickable="false" android:focusable="false" android:focusableInTouchMode="false" android:longClickable="false"/>
<TextView
android:id="#+id/p60001_item_notices"
android:layout_width="10dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/icon"
android:ems="10" android:layout_marginRight="40dp" android:background="#android:color/transparent" android:freezesText="false" android:focusableInTouchMode="false" android:focusable="false" android:clickable="false" android:selectAllOnFocus="false" android:textSize="20px" android:layout_marginTop="4dp" android:visibility="invisible">
<requestFocus />
</TextView>
</RelativeLayout>
If you are using custom adapter concept and the above is your getView code.
you must a convert view(xml file of each row) change the background of it like below.
if (position % 2 == 0){
converterView.setBackgroundResource(R.drawable.cell_g_02);
//root.setBackgroundColor(R.color.color_fist_in_pack_view);
}else{
converterView.setBackgroundResource(R.drawable.cell_g_01);
//root.setBackgroundColor(R.color.color_fist_in_pack_view);
}
if you need to change the color on focus or pressed you use the below xml as background.
<?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/red" />
<item android:state_selected="true"
android:drawable="#color/red" />
</selector>
also if need to set background for clicked items then a way to do this is::::
to have a bool variable(=false)in your pojo(bean) where you are storing the data of each item.
so when ever you click on item make that variable to true. And in getView() just check whether that variable is true or false and do the need full accordingly.
Try this
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- When selected, use selected state color -->
<item android:drawable="#drawable/your_drawable_when_selected"
android:state_selected="true" />
<!-- When not selected, use default item color-->
<item android:drawable="#drawable/your_drawable_when_unselected" />
</selector>

Categories

Resources