Android: setpadding not working with imageview - android

I have two imageviews and I want to create a border like effect whenever a user clicks on them.
I have set the background of both the imageviews to colour. Now, when a user taps on the image, I set some padding on the imageview so that it creates a border like effect.But, unfortunately its not happening.
this is my java code:
public void imageClick(View view)
{
switch(view.getId())
{
case (R.id.imageView1):
image1.setPadding(10,10,10,10);
image2.setPadding(0,0,0,0);
break;
case (R.id.imageView2):
image1.setPadding(0,0,0,0);
image2.setPadding(10,10,10,10);
break;
}
}
I can't understand why nothing is happening when the image is clicked. I have tried both
android:cropToPadding = "true"
and
android:cropToPadding = "false"
but again, no results.
My xml code for the imageViews:
<ImageView
android:layout_width="0dp"
android:id="#+id/imageRegion1"
android:layout_height="match_parent"
android:layout_weight="1"
android:onClick="imageClick"
android:cropToPadding="false"
android:background="#fffff300" />
<ImageView
android:id="#+id/imageRegion2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:onClick="imageClick"
android:cropToPadding="false"
android:background="#fffff300" />
I am setting the imageviews dynamically by :
image1.setImageBitmap(bitmap1);
image2.setImageBitmap(bitmap2);

As it seems you are most probably using weightSum & layout_weight mechanism to calculate imageview's width equally or rationally.
If I am right here, in this case, when you are setting padding, its not going to make any change in the already inflated view. As you may expect setting padding value will reduce the width & height. But it will not. Because, due to weight calculation it will take the previous width/height values thus will ignore padding.
I hope this will help you to solve the problem.

<LinearLayout
android:id="#+id/row_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:visibility="visible" >
<ImageView
android:id="#+id/imageRegion1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:background="#fffff300"
android:cropToPadding="false"
android:onClick="imageClick" />
<ImageView
android:id="#+id/imageRegion2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:background="#fffff300"
android:cropToPadding="false"
android:onClick="imageClick" />
</LinearLayout>
i tried with this above.its working fine for me.try again

Related

Android RecyclerView messing up layout_weight

I have a pretty simple RecyclerView within a DialogFragment
A single-line item is supposed to show an image, first and last name and some numbers. They are laid out with the help of layout_weight to equally share the available space.
For some reason, some of the items randomly seem to calculate the layout_weight wrong.
Note that in the editor preview, and after scrolling the problematic item out of view, the problem is fixed and the layout returns to normal.
As you can see in the image, in the first item (it's not always (just) the first) the image gets way too much space.
My layout is as follows;
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/dodger_blue"
android:orientation="horizontal"
android:padding="8dp">
<ImageView
android:id="#+id/iv_face"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="vertical">
<TextView
android:id="#+id/et_first_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLargeInverse"
android:textStyle="bold"/>
<TextView
android:id="#+id/et_surname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMediumInverse"/>
</LinearLayout>
<TextView
android:id="#+id/et_id"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:textAppearance="?android:attr/textAppearanceMediumInverse"/>
<TextView
android:id="#+id/et_place"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.8"
android:gravity="center|end"
android:textAppearance="?android:attr/textAppearanceLargeInverse"/>
</LinearLayout>
And my adapter;
https://gist.github.com/StefanDeBruijn/f032eac6619ac1b8420e352b883ea4dd
I suspect this is happening because of the large image being set in the image view. As you have set the height of the image as match_parent. To maintain the aspect ratio it is also expanding across the width.
Probably you should try adding this property to the in your xml file and fixing the height of the image.
android:scaleType="fitXY"
android:layout_height=100dp
Let me know if this fixes your issue.

ImageView overlay not working

I have 2 layouts in my xml, a CircularImageView and a ImageView, and the ImageView must appear on top of the CircularImageView.
I've tried:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/fragment_kids_register_ll_kid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/md_white_1000"
android:orientation="horizontal">
<RelativeLayout
android:padding="16dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.mikhaellopez.circularimageview.CircularImageView
android:id="#+id/fragment_kids_row_img_kids"
android:layout_width="70dp"
android:layout_height="70dp"
android:src="#drawable/ic_boy"
/>
<ImageView
android:id="#+id/fragment_kids_row_iv_crown"
android:layout_toRightOf="#+id/fragment_kids_row_img_kids"
android:layout_marginLeft="-26dp"
android:layout_marginTop="-22dp"
android:layout_width="48dp"
android:layout_height="48dp"
android:src="#drawable/ic_crown"/>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/fragment_kids_row_tv_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:textColor="#color/md_black_1000"
android:textSize="24sp" />
<TextView
android:id="#+id/fragment_kids_row_tv_age"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="1 ano e 4 meses"
android:textColor="#808080"
android:textSize="12sp" />
</LinearLayout>
</LinearLayout>
And it is getting cut off:
I need the image to be shown exactly at that position in the picture, but not "cropped", what I am missing here ?
BTW, this component is part of a RecyclerView row.
EDIT ---
I forgot to mention, the image is just a placeholder to show the Avatar, but the image is dinamically populated !
Thanks !
The padding (16dp) that you are applying to the first relativeLayout makes you think that there is more place and that you can move up the imageView. Actually the margin is like a gap, it doesn't extend your layout.
This is the solution I suggest , using a FrameLayout
<FrameLayout
android:layout_width="100dp"
android:layout_height="100dp">
<com.mikhaellopez.circularimageview.CircularImageView
android:id="#+id/fragment_kids_row_img_kids"
android:layout_gravity = "center"
android:layout_width="70dp"
android:layout_height="70dp"
android:src="#drawable/ic_boy"
/>
<ImageView
android:id="#+id/fragment_kids_row_iv_crown"
android:layout_width="48dp"
android:layout_height="48dp"
android:src="#drawable/ic_crown"
android:layout_gravity="right|top" />
</FrameLayout>
EDIT : You don't have to use a frameLayout, you can use a relativeLayout if you want to set different margins. The point here is really to make your containing layout bigger so you can place the imageview easily.
If you want one image to be on top of another, why you use android:layout_toRightOf?
Remove it and second image should cover first one.
Also you can try to remove margins at second image and use centerInParent, centerVertically or centerHorizontally.
Or maybe I didn't got all the problem ) then pls provide more details. Thanks.
Have you tried Using an image editor like Paint/Photoshop and merging the two images? Then you can just display one image in your view.
try using a linear layout with the orientation set to vertical.

Android scale button margin with background image of parent view

In my app, I have a couple rows of buttons that share a single background image when not pressed, but get an individual background image when pressed.
To clarify myself: the buttons share a parent with a big background image, so the shadows don't interfere. When I press on a button, the transparent background image of the pressed button changes to a version that's pressed down and is put over the background image of the parent. There is a margin on the buttons because the mutual background image has shadows that I don't want the buttons to be on top off.
The current code works great on most devices, but on a tablet the margins are off so the buttons are bigger than the other buttons when pressed.
I know there are different units of measure (dp, sp, pt, px, mm and im), but I can't seem to get one to work like I want it to.
<LinearLayout
android:id="#+id/LinearLayout_volume"
android:layout_width="match_parent"
android:layout_weight="0.2"
android:layout_height="0dp"
android:baselineAligned="true"
android:background="#drawable/knoppen">
<ImageButton
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="fill_parent"
android:id="#+id/Btn_VolDown"
android:cropToPadding="false"
android:background="#drawable/mainbtn"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"
android:src="#drawable/voldown"
android:scaleType="fitCenter"
android:contentDescription="#string/description_volDown" />
<ImageButton
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="fill_parent"
android:id="#+id/Btn_Mute"
android:onClick="onUdpBtnClicked"
android:cropToPadding="false"
android:background="#drawable/mainbtn"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:src="#drawable/mute"
android:scaleType="fitCenter"
android:padding="0dp"
android:contentDescription="#string/description_mute" />
<ImageButton
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="fill_parent"
android:id="#+id/Btn_VolUp"
android:onClick="onUdpBtnClicked"
android:cropToPadding="false"
android:background="#drawable/mainbtn"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:scaleType="fitCenter"
android:src="#drawable/volup"
android:contentDescription="#string/description_volUp" />
</LinearLayout>
So to summarize: I have an image with a certain margin where I don't want anything on top off and I have a button where I have to specify that margin, but I need it to scale with the image
I hope I'm clear enough and thank you in advance
Well i'm not sure if its what u want but if what u mean with an image is ImageView then u can use a linear layout to make your other stuff boxed to stay below your ImageView so it wont ever get on top off that.
Or maybe you can use something like this too
LayoutParams params1 = (LayoutParams)twoLetter.getLayoutParams();//twoletter-imageview
params1.height = 70;
params1.setMargins(0, 210, 0, 0);//top margin -210 here
twoLetter.setLayoutParams(params1);//setting layout params
twoLetter.setImageResource(R.drawable.oo);
i'm not sure what you are trying so sorry for not being so helpful.

Button layout_height=wrap_content inside linear layout has height much bigger then wrap_content

I have LinearLayout with TextView and Button. I set layout_height attribute to wrap_content but layout_height has much bigger size. If I remove this button then all is alright. I try to decrease button text size but frame of the button still the same. I don't want hardcode button size. What can be the reason this strange result?
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="1" >
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="#dimen/left_margin"
android:layout_marginTop="#dimen/top_margin"
android:layout_weight=".3"
android:text="#string/contact" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.7"
android:layout_marginLeft="#dimen/left_margin"
android:layout_marginTop="#dimen/top_margin"
android:orientation="horizontal"
android:weightSum="1" >
<TextView
android:id="#+id/contact"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/contact" android:textSize="#dimen/button_font_size"/>
</LinearLayout>
Button has background and other layout properties and does not seem possible to reduce its height. An option would be to use a TextView with custom style and handle click event so that it behaves like a Button.
Example:
<TextView
android:layout_height="wrap_content"
android:background="#ddd"
android:padding="6dp"
android:layout_width="wrap_content"
android:text="Contact" />
It requires some work and time spent to style the TextView properly, but if you have no other choice, it may do the trick for you.
I had this issue as well when using a button, you can manually set the height and width, but I also have not found a set way to reduce the wrap_content size.
android:layout_width="40dp"
android:layout_height="30dp"
This is because of minimum height of a button. Set android:minHeight="1dp" or any other size to make it happen.

Handle ImageButtons with different image sizes

My layout contains 3 ImageButtons, arranged vertical in a LinearLayout.
Now I want that each of them has the same height and together fill the device's screen height.
Works fine with the attribute android:layout_weight="1". But if the image of one ImageButton is too big, it won't work (this button is higher than the others), despite setting android:scaleType="center_inside".
Any advices/tricks?
If you need any code, let me know. But there is nothin special.
If you have given weights correctly than this should work. The size of the image doesn't matter than. Just one thing to keep in mind while using weights is that attribute for which you are giving the weight(height/width) should be assigned value "0dp" in the xml, only then the weights will work correctly. Here is the example code.
<?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:gravity="center"
android:weightSum="3">
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:src="#drawable/drawable1"
android:layout_weight="1"
android:scaleType="centerInside"
/>
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:src="#drawable/drawable2"
android:scaleType="fitXY" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:src="#drawable/drawable3"
android:scaleType="fitXY" />
</LinearLayout>
Just use this xml and replace the drawables according to your needs. Let me know if any issues.

Categories

Resources