I have a button with an image. The height of the image should be the 20% of the height of the device. So I set the height of the image programmatically.
The problem is that, if i do it, the image becomes stretched. I put the settings that it has to be scaled centerinside and I have tried also with other elements, as imagebutton or imageview, but I had always the same problem.
How can I do?
UPDATE
This is my xml code:
<LinearLayout
android:id="#+id/letterLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
android:layout_marginBottom="10dp"
android:scaleType="centerCrop"
android:gravity="center"
android:layout_gravity="center"
android:onClick="onClick">
<Button
android:id="#+id/letterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:fontFamily="sans-serif"
android:textStyle="bold"
android:padding="30dp"
android:textColor="#000000"
android:background="#00000000"
android:clickable="false"/>
</LinearLayout>
And my Java code where i set the height:
letterLayout.getLayoutParams().height = (int) (hQdr);
letterTest.getLayoutParams().height = (int) (hQdr);
//letterTest.getLayoutParams().width = (int) (wQdr);
Did you tried with the parameter android:scaleType="centerCrop"? This Crops your Image to enter in the layout
Related
Im new with Android programming on Android Studio and this seems to be simple question.
In Swift I used to get screen WIDTH and HEIGHT to put all my widgets on screen position and resize them, which in my opinion is a nice way to do that.
Here I don't know how to do that.
Ive made this screen here on XML file, this screen is the PREVIEW:
Ive set the buttons like this:
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="match_parent"
android:scaleType="fitXY"
android:alpha="0.7"
android:src="#mipmap/imgbackgroundstartview"
android:id="#+id/imgBackgroundStartView"
android:layout_height="wrap_content"/>
<ImageView
android:layout_width="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#mipmap/btnstartcpr"
android:id="#+id/imgStartViewStartVisible"
android:layout_height="wrap_content"/>
<ImageView
android:layout_width="match_parent"
android:layout_centerHorizontal="true"
android:src="#mipmap/imgstartviewtitle"
android:layout_marginTop="20dp"
android:layout_marginRight="20dp"
android:layout_marginBottom="400dp"
android:id="#+id/imgStartViewTitle"
android:layout_height="wrap_content"/>
<TextView
android:layout_width="match_parent"
android:layout_centerVertical="true"
android:text="START"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:textColor="#ffffffff"
android:textStyle="bold"
android:fontFamily="sans-serif-medium"
android:textSize="36dp"
android:layout_height="wrap_content" />
<Button
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="420dp"
android:layout_marginRight="250dp"
android:layout_marginBottom="20dp"
android:id="#+id/btnLoginStartView"
android:background="#mipmap/imgstartviewlogin"
android:layout_height="wrap_content"/>
</RelativeLayout>
However when I run the program it has a different positioning and sizes:
So short question: how to do the same as I was doing on SWIFT, ie:
Set button height as 10% of screen height;
Set button width as 50% of screen width;
Position button on point (width: 50% of screen width, height: 50% of screen height), which is middle of screen.
The answer could be programmatically or on XML file, both works for me.
Thanks in advance!
Tried to make image taken to fit the whole screen size width, and top
Picture output should be like this:
The output on the screen of my app is as below with blank space on top, left and right side.
My XML for the activity layout is below:
<RelativeLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/vestGlavnaSlikaLayout"
android:layoutDirection="ltr">
<ImageView
android:id="#+id/iv"
android:layout_width="match_parent"
android:fitsSystemWindows="false"
android:scaleType="fitXY"
android:layout_marginTop="-20dp"
android:focusable="false"
android:cropToPadding="false"
android:adjustViewBounds="true"
android:layout_alignParentBottom="false"
android:layout_alignParentRight="false"
android:layout_height="wrap_content"
android:layout_marginLeft="-20dp"
android:layout_alignParentEnd="false"
android:layout_marginRight="-20dp" />
<TextView
android:background="#android:color/black"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tekstglavnevesti"
android:textColor="#android:color/background_light"
android:textSize="20dp"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:textStyle="normal|bold" />
</RelativeLayout>
My code to display the image:
ImageView iv = (ImageView) v. findViewById(R.id.iv);
Picasso.with(getActivity()).load(slikeZaVesti.get(0))
.into(iv); // jpg tag is pasrsed from html
As you l might observe, there are blank spaces at both left and right side of the image. Any way to make the image fit perfectly onto the screen?
Below is the layout of an item of recyclerview.I want to create a vertical view at left of each item of layout such that it matches the height of the item.I used below code-
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="#drawable/foodvitebackground">
<TextView
android:id="#+id/invitename"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18dp"
android:textColor="#color/adsd"
android:text="fasf"
android:layout_marginTop="10dp"
android:layout_marginLeft="15dp"/>
<TextView
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/invitename"
android:layout_marginTop="8dp"
android:layout_marginLeft="15dp"
android:layout_toLeftOf="#+id/profileimage"
android:gravity="left"
android:textColor="#color/foodvite_invitename"
android:textSize="20dp"
android:text="Fill-a Pita"/>
<TextView
android:id="#+id/jJoinTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/name"
android:layout_marginTop="8dp"
android:layout_marginLeft="15dp"
android:textSize="12dp"
android:text="Today,8:30PM"
android:textColor="#color/joinTime"/>
<com.mikhaellopez.circularimageview.CircularImageView
android:id="#+id/profileimage"
android:layout_width="#dimen/hundred_dp"
android:layout_height="#dimen/hundred_dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="15dp"
android:scaleType="fitCenter"/>
<TextView
android:id="#+id/invitescount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="20"
android:textColor="#color/white"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:background="#drawable/ret"
android:layout_marginBottom="15dp"
android:layout_marginRight="15dp"
android:layout_alignBottom="#+id/message"
android:layout_alignRight="#+id/profileimage"
android:layout_alignEnd="#+id/profileimage"/>
<View
android:id="#+id/leftbar"
android:layout_width="6dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:background="#drawable/foodviterespoded"/>
</RelativeLayout>
With above code i don't see view with id leftbar visible.However if i change height of that view from match_parent to some numerical value like 160dp then i see the left bar view visible.Why is this happening.And i don't want to set height in numerical value bcoz i want my view to stretch to complete height of item and height of item might be different in different device.
Calculate the recycler view's cell height in the view holder's constructor.
itemView.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
height = itemView.getMeasuredHeight();
Set the divider's height with the above calculated height in onBindViewHolder()
RelativeLayout.LayoutParams divParams = (RelativeLayout.LayoutParams)
divider.getLayoutParams();
divParams.height = height;//Add any top or bottom margin(in pixel) specified
divider.setLayoutParams(divParams);
You are giving the height as wrap content for the parent relativelayout which is removing the leftbar view. Try setting the parent relative layout height as match parent
Can you try with android:layout_alignParentTop="true" and android:layout_alignParentBottom="true" set to the View with id "leftbar".
Update:
try this.
<View
android:id="#+id/leftbar"
android:layout_width="6dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignTop="#+id/invitename"
android:layout_alignBottom="#+id/jJoinTime"
android:background="#drawable/foodviterespoded"/>
I have a button which have both text and image. The image size it is taking as actual size of image. How can i change the size of image in button?
<Button
android:id="#+id/button3"
android:layout_weight="1"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:drawableTop="#drawable/home_icon"
android:text="Settings"
/>
Set
android:scaleType="fitXY"
Also wrap_content is the preferred Parameter for width and height so that the OS will automatically adjust depending upon the screen size.
Please refer to
Android - Image Button Scale
and
Adjusting the size of an ImageButton in Android
You should use a ImageButton and specify the image in android:src, and set android:scaletype to fitXY
Set Drawable in your code
Drawable drawable = getResources().getDrawable(R.drawable.icon);
drawable.setBounds(0, 0, (int)(drawable.getIntrinsicWidth()*0.10),
(int)(drawable.getIntrinsicHeight()*0.10));
ScaleDrawable sd = new ScaleDrawable(drawable, 0, sWidth,sHeight);
Button btn = findViewbyId(R.id.btnId);
btn.setCompoundDrawables(sd.getDrawable(), null, null, null); //set drawableLeft/Right for example
Control the size deterministically with specific measurements. For example:
<Button
android:id="#+id/button3"
android:layout_weight="1"
android:layout_height="50dp"
android:layout_width="50dp"
android:background="#drawable/home_icon"
android:text="Settings"
/>
For even more control over the button's design use a container such as a RelativeLayout to hold the image and the text. Then assign an onClickListener to the container to turn it into a clickable button. Here's an example:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/snazzy_button_with_image_above_text"
android:layout_width="wrap_content"
android:layout_height="64dp"
android:layout_gravity="center"
android:layout_marginLeft="1dp"
android:background="#color/SkyBlue"
android:paddingBottom="2dp"
android:paddingLeft="1dp"
android:paddingRight="1dp"
android:paddingTop="1dp" >
<ImageView
android:id="#+id/your_image"
android:layout_width="50dp"
android:layout_height="match_parent"
android:layout_gravity="center"
android:background="#color/white"
android:contentDescription="image inside button"
android:scaleType="centerCrop" />
<TextView
android:id="#+id/your_text"
android:layout_width="50dp"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/your_image"
android:layout_alignParentLeft="true"
android:layout_gravity="center"
android:layout_marginBottom="0dp"
android:layout_marginTop="0dp"
android:background="#color/translucent_black"
android:gravity="bottom|center_horizontal"
android:paddingTop="0dp"
android:text="Your Button Text"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#color/white"
android:textSize="10sp" />
</RelativeLayout>
In the code assign the onClickListener as such:
yourButton = (RelativeLayout) findViewById(R.id.snazzy_button_with_image_above_text);
yourButton.setOnClickListener(new View.OnClickListener() {
public void onClick(View clickedButton) {
//button click action here
}
Set android:background="#drawable/image_name"
and give width and height like
android:layout_height="10dp"
android:layout_height="10dp"
or you can try using ImageButton instead of Button because ImageButton has more image rendering options than Button
You can refer here
Simple way: add next line to dimens.xml
This parameter change size all icons on buttons in AlertDialog
<resources>
<dimen name="abc_alert_dialog_button_dimen">24dp</dimen>
</resources>
I'm building my first android application.In my starting activity I want to use some ImageViews instead of buttons,These ImageViews are big tiles that their width should always match the parent Layout.I've drawn my imageViews to fit a normal mobile screen (4 inches I think ) how can i have them fit any device? like a 7 or 10 inch Tablet?
EDIT: Well sadly I used the fitCenter and didn't make any difference,that's my xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="24dp"
android:layout_marginTop="122dp"
android:drawableLeft="#drawable/home"
android:drawablePadding="#dimen/padding_small"
android:padding="#dimen/padding_small"
android:text="My Classes"
android:textSize="#dimen/a12" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/button3"
android:layout_alignRight="#+id/button3"
android:layout_centerVertical="true"
android:layout_below="#+id/button3"
android:layout_marginTop="35dp"
android:drawableLeft="#drawable/image"
android:text="Update Offline Data"
android:textSize="#dimen/a12" />
<Button
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/button1"
android:layout_alignRight="#+id/button1"
android:layout_below="#+id/button1"
android:layout_marginTop="35dp"
android:drawableLeft="#drawable/configure"
android:text="Settings"
android:textSize="#dimen/a12" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="38dp"
android:scaleType="fitCenter"
android:src="#android:drawable/bottom_bar" />
for fit the images you can use android:scaleType="fitCenter" attribute in your control
like this:
<ImageButton
android:id="#+id/imageViewSecurity"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/security"
android:background="#null"
android:scaleType="fitCenter" />
Instead of giving them an absolute width, use the constant match_parent as android:width, that will always give them the same width as the parent view. The root view of an activity will have the same size as the screen with this width and/or height.
To also size an image in the ImageView to the correct size, use fitCenter as android:scaletype.
If all you're trying to do is getting the image to match the width of its container (and its container is matching the width of *its parent) then you should set the image as the background of the View, rather than its src. I believe that will stretch it to fill the entire View, whatever its size is.