Did anybody encounter the situation when you have an ImageView with adjustViewBounds="true" and you need to align another view with it? My layout is working unpredictably:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/thumb"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerInside"
android:src="#drawable/thumbnail"
android:layout_centerInParent="true"
android:adjustViewBounds="true"/>
<LinearLayout
android:id="#+id/selection"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignTop="#id/thumb"
android:layout_alignBottom="#id/thumb">
</LinearLayout>
</RelativeLayout>
It would be great to not code that aligning.
I changed RelativeLayout width and height to match_parent, and work for me. By the way what is the point to align center the ImageView if it limited its size? It don't understand. What's the aim? Can you post a wireframe?
Related
Here is my problem. I have a Horizontal scrollView in which I have a Relative layout with couple of images inside. The problem is that the first image is set to wrap_content width but it makes extra space at the end. Can you please tell me how I can fix this without setting the scale type to some kind of crop. I have posted the screenshots of what I get. The white part is the extra space at the end of the scroll which is part of the imageview. Also below that I have posted the code. Thanks
<HorizontalScrollView
android:fillViewport="true"
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none">
<RelativeLayout
android:id="#+id/scrollBg"
android:background="#color/colorAccent"
android:layout_width="wrap_content"
android:layout_height="match_parent">
<ImageView
android:background="#color/white"
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:scaleType="fitStart"
android:contentDescription="#string/content_description"
android:src="#drawable/bg_login" />
<ImageView
android:visibility="gone"
android:id="#+id/treeImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#drawable/tree4" />
</RelativeLayout>
</HorizontalScrollView>
Ok I found a solution. I just added android:adjustViewBounds="true" in the imageview with extra space. That fixed the problem
i'm trying to make ImageView take match_parent of RelativeLayout
like this picture :
when i run my app ImageView looks like that :
this my xml :
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linealL"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/khdar">
<RelativeLayout
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_margin="10dp"
android:id="#+id/RelativeLayout02"
android:layout_width="wrap_content"
android:background="#color/colorGriviewBorder"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_margin="5dp"
android:id="#+id/LinearLayout01"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/gradient"
android:orientation="vertical" >
<TextView
android:text="GIF"
android:textSize="16sp"
android:layout_gravity="center"
android:textColor="#color/colorGriviewBorder"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/dev"/>
</LinearLayout>
<ImageView
android:padding="8dp"
android:layout_below="#+id/LinearLayout01"
android:contentDescription="#string/app_name"
android:id="#+id/imageSelectTo"
android:scaleType="fitXY"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_height="wrap_content"
android:layout_width="wrap_content"/>
</RelativeLayout>
</RelativeLayout>
Change layout_width of ImageView to match_parent and add one new attribute to it: android:adjustViewBounds="true".
If you want to fit the ImageView width then You have to ignore height. And by default will not strech for you to keep aspect ratio, so you need to add another attributes for adjust view bounds. So lastly you will have your code chages as follows for an ImageView:
android:layout_width="match_parent"
android:adjustViewBounds="true"
The adjust View bounds will adjust to a particular height while keeping the aspect ratio.
More
Also to avoid future mistakes again in your code you have nested two RelativeLayout's which I guess is due backgrounds. If there is no need for that If do not care about space. The inner RelativeLayout View height and width should be set to match_parent!. Happy Coding!
Your ImageView's layout_width and layout_height are set to wrap_content instead of match_parent.
i have an imageview on a relative layout.
You can see in the screenshot :
How can i move the imageview(the weel) in the bottom-right corner, but display only 25 % part of it, like in the follow picture:
Thanks in advance !
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent"
android:background="#E0E0E0"
>
<com.androidsources.welcomescreen.MyRecyclerView
android:foreground="?android:attr/selectableItemBackground"
android:clickable="true"
android:id="#+id/cardList"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<com.anupcowkur.wheelmenu.WheelMenu
android:id="#+id/wheelMenu"
android:layout_width="300dp"
android:layout_height="300dp"
android:src="#drawable/wheel"/>
</RelativeLayout>
You can try something like this:
<com.anupcowkur.wheelmenu.WheelMenu
android:id="#+id/wheelMenu"
android:layout_width="300dp"
android:layout_height="300dp"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:paddingLeft="150dp"
android:paddingTop="150dp"
android:src="#drawable/wheel"/>
alignParentRight and alignParentBottom attributes will move your widget at the right bottom corner. Also try to change padding to achieve desired visual effect.
I know that there is already an answer, but for those who can't make the accepted answer work here is an alternative.
For some reason, I can't place part of the view outside the parent if I'm using RelativeLayout but when I tried LinearLayout it worked. So the solution I used is to enclose the view in a LinearLayout then position the LinearLayout on bottom-end of the parent.
<LinearLayout
android:layout_width="300dp"
android:layout_height="300dp"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true">
<ImageView
android:layout_width="300dp"
android:layout_height="300dp"
android:src="#drawable/some_pic"
android:layout_marginStart="150dp"
android:layout_marginTop="150dp"/>
</LinearLayout>
Note the width and height of the image is not match_parent, using match_parent will shrink the image not displace it.
Well I have to fit one ImageView inside another one. It is smaller and has to be exactly at the center. I have both images scaled for different screen resolutions but I can test only on one phone and I am wondering if I set the second image's height and width with dpi to fit my screen resolution will it be perfectly matched on all screens or is there any property in Android aside from setting the height and width that will automatically center one ImageView inside of other ImageView?
Edit: It's in RelativeLayout and the ImageViews are at the top left so I haven't added anything specific to the because they by default are there.
Edit2: Well changing the first ImageView to be RelativeLayout helps center the second image inside of it but then the RelativeLayout grows too big and enlarges the image that is background. Is there a way to make the RelativeLayout be as big as its background?
try this
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="250dp"
android:layout_height="250dp" >
<ImageView
android:id="#+id/base"
android:layout_height="250dp"
android:layout_width="250dp"
android:src="#drawable/home"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" />
<ImageView
android:id="#+id/center"
android:layout_height="150dp"
android:layout_width="150dp"
android:src="#drawable/home"
android:layout_centerInParent="true"
android:layout_centerVertical="true" />
</RelativeLayout>
</RelativeLayout>
You cannot put an imageView inside another. Hope the following code will be helpful for you.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background_image"
android:gravity="center" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/image_on_center" />
</LinearLayout>
Use RelativeLayout and then use android:layout_centerInParent="true" remember the order you add the ImageViews will decide what is on top :)
Try this:
android:layout_gravity="center"
In my layout I have a FrameLayout which contains 2 ImageViews. One ImageView is shown at a time and the change between ImageViews is done through 3D Rotation animation.
<FrameLayout
android:id="#+id/animContainer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp" >
<ImageView
android:id="#+id/picture1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
android:src="#drawable/malware" />
<ImageView
android:id="#+id/picture2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
android:src="#drawable/browsing"
android:visibility="gone" />
</FrameLayout>
The problem with my xml is that it leaves some empty space above and below the ImageView in the FrameLayout even though I have not specified any top or bottom margin/padding to it.
The ImageViews I'm using in the FrameLayout are of equal heights.
I want the height of the FrameLayout to be exactly same as the height of the ImageViews within it.
How do I achieve this?
Thank you.
EDIT:
Another thing I have observed is that in landscape mode the empty space is added to the left and right of the ImageViews and the width of the FrameLayout does not match with the width of the ImageViews.
How can have the FrameLayout width and height same as that of the ImageViews?
I think you need to use android:adjustViewBounds="true" -> in your ImageView's ... This will resize the imageview to the image inside and hopefully fix your problem.
http://developer.android.com/reference/android/widget/ImageView.html#attr_android:adjustViewBounds
I think I found a solution, in mine I had to place an image in the right hand corner for the delete icon but had to jump through hoops to get the edge of the X to line up with the top of the photo. fitCenter would create whitespace on top and bottom. fitStart worked like a charm.
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/front_right"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="top"
android:scaleType="fitStart"
android:adjustViewBounds="true"
android:onClick="imageEditClicked"
android:src="#drawable/myimage"/>
<ImageView
android:id="#+id/front_right_x"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:background="#color/white"
android:layout_gravity="end|top"
android:clickable="true"
android:focusable="true"
app:srcCompat="#drawable/com_facebook_tooltip_black_xout" />
</FrameLayout>