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.
Related
when I remove gravity attribute then the image will set on top corner right but when it used it leave padding at the top why gravity leaves space ????
enter image description here
android:gravity="center" ---> center_horizontal+center_vertical
The center_vertical attribute leaves the padding at the top. Changing it to center_horizontal will make the view/views just align center horizontally so use
android:gravity="center_horizontal"
I think why should you use layout_marginTop in imageview?it's not necessory to set.you can set layout_gravity at imageview and remove gravity at top linear layout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/black">
<ImageView
android:layout_width="wrap_content"
android:layout_height="200dp"
android:src="#drawable/android_ic"
android:layout_gravity="center"
/>
</LinearLayout>
When you have added android:gravity="center" your entire layout will be at center of the screen.Since you have added multiple views below the imageView, it has been managed to be at the top with some space.Change it to android:gravity="center_horizontal" and also if the image is small set the height as "wrap_content" instead of 200dp ,it may also have additional space.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="200dp"
android:src="#drawable/coffee"
/></LinearLayout>
I have needed to create view like and this view will be placed like
I am trying to create this using frame layout but finish with failure. How can i do this?
Either use a FrameLayout and add this as an imageview last with specified right and top layout margins for this view and some slightly larger right margins for the underlying layout.
Or a RelativeLayout and you align this view to the parent right using (layout_alignParentRight="true") and with margins as with previous example.
Example trying to mimic your layout a bit, tweak the margins and image to your needs:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#bbbb00"
android:layout_marginRight="2dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#888899"
android:layout_margin="20dp">
</LinearLayout>
</LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_marginTop="80dp"
android:src="#drawable/test"/>
</FrameLayout>
I have a layout something like this:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="10dp"
android:background="#ff303f"
android:id="#+id/layout">
<ImageView
android:id="#+id/picture"
android:layout_width="300dp"
android:layout_height="300dp"
android:layout_centerInParent="true"/>
<Button
android:id="#+id/cancel"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_alignRight="#id/picture"
android:background="#drawable/cross_out"/>
</RelativeLayout>
I inflate it using the usual layout inflator service, set up some functionality to the button and an image to the imageview (all images are of same size and aspect ratio).
After that, I add this view to my fragment's layout which is nothing but a ScrollView which is a parent, it has a child linear layout that I call 'map' and simply add it to the map.
Expected : The added layouts should get added properly and I can scroll through it.
Actual : If more than 2 are added, the first one gets eaten up. I can see it half or sometimes it is completely eaten up. :\
Any idea whats going on here? Thanks a lot for your time.
EDIT:
Here's the layout file I add the inflated layout into:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#f6ff45">
<LinearLayout
android:id="#+id/map"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#43ff44"
android:orientation="vertical"
android:layout_margin="10dp"
android:layout_gravity="center"
android:layout_marginTop="15dp">
</LinearLayout>
</ScrollView>
I also forgot to mention that after adding 3 or more of these layouts, I realized there's unnecessary empty space in the end. :\
If you have some android:layout_gravity or gravity property in your ScrollView, that may be the reason. Try deleting it, or make it center_horizontal.
Try this code for your layout file;
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#f6ff45">
<LinearLayout
android:id="#+id/map"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#43ff44"
android:orientation="vertical"
android:layout_margin="10dp"
android:layout_gravity="center"
android:layout_marginTop="15dp">
</LinearLayout>
</ScrollView>
As I mentioned before, android:layout_gravity="center"in this LinearLayout causes this problem. Because it doesn't only horizontally center but also verticelly center the contents. It means when they are longer than the available height, the center part will appear. I only changed it into android:layout_gravity="center_horizontal" and the problem is fixed.
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"
Here is the XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/bg"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="4"
android:orientation="vertical"
>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal" //CENTER 01
>
<!--center button-->
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/img"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" //CENTER 02
/>
//...
</RelativeLayout>
</LinearLayout>
<include android:id="#+id/banner" layout="#layout/banner"
android:layout_weight="1"
android:layout_gravity="bottom"/>
</LinearLayout>
The center button is centered, but not in the real center of the screen, but rather approx 50px to the right of the center. If I remove centerHorizontal CENTER01, then this does not happen.
Does anyone know why is this happening?
Please try for //CENTER 02:
android:layout_centerInParent="true"
This issue may be due to using of both Relative Layout and Linear Layout inside a xml file.
Change all Linear Layout to Relative Layouts so that Image View will be centered as you expected.
I too mingled both Linear Layout and Relative Layout in single XML and faces this kind of issue. Once i replaces all Linear Layout to Relative Layout my problem Resolved.
Try it.Thanks.Venky
Its because in Relative Layout center_horizontal isn't the command. that works for views wrapped in linear Layout. for RelativeLayout you need to use
android:layout_centerInParent="true";
as the center gravity command in linear
or
android:layout_centerHorizontal="true"
as the gravity center_horizontal in linear.
When you set android:gravity="center_horizontal" on a parent, it influences the behaviour of its children. Hence, your ImageView gets effected, creating the effect you see after already being placed in the center by other properties.
You can see this effect for yourself by placing a TextView in there with android:layout_width="fill_parent".