I am able to center my image horizontal, but not vertical.. any idea's what might cause this? It should be in the center of the screen. I have also tried android:layout_gravity="center_vertical" but doesn't seem to do the trick...
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/splash"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/splash" />
</LinearLayout>
A LinearLayout does not allow this behavior. Try a RelativeLayout instead.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/splash"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/splash" />
</RelativeLayout>
Why do you need a LinearLayout at all? You can just use the ImageView with the scaleType=center
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/splash"
android:src="#drawable/splash"
android:scaleType="center" />
That's your whole xml...
You will have to use RelativeLayout for such behavior. I can't think of a good way to do it with LinearLayout. Additionally, you can try the Graphical Layout (depends on the editor you are using).
I used two images in invisible mode just for create space.
Try this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/fake"
android:layout_width="wrap_content"
android:layout_height="200dp"
android:src="#drawable/splash"
android:visibility="invisible" />
<ImageView
android:id="#+id/splash"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/splash" />
<ImageView
android:id="#+id/fake"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="#drawable/splash"
android:visibility="invisible" />
</LinearLayout>
Related
I was trying to use Scroll Layout in Android. I want my views to get scrolled vertically. But I could see only HorizontalScrollLayout. What do I do If I want Vertical?
Here is the Code
<?xml version="1.0" encoding="utf-8"?>
<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent"
android:id="#+id/scrollView"
android:layout_centerVertical="true"
android:orientation="vertical"
android:background="#color/abc_input_method_navigation_guard">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_gravity="center_horizontal">
<ImageButton
android:layout_width="300dp"
android:layout_height="200dp"
android:layout_gravity="center"
android:src="#drawable/lion"
android:background="#color/abc_input_method_navigation_guard"
android:scaleType="fitXY"
android:padding="20dp"
android:id="#+id/image1" />
<ImageButton
android:layout_width="300dp"
android:layout_height="200dp"
android:layout_gravity="center"
android:src="#drawable/lion"
android:background="#color/abc_input_method_navigation_guard"
android:scaleType="fitXY"
android:padding="20dp"
android:id="#+id/image2" />
</LinearLayout>
</HorizontalScrollView>
Can anyone suggest me the solution?
Just use ScrollView. Here is the docs, and here is sample.
Please look at into this for reference.
Sample code for Vertical ScrollView
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
// Here all child view like TextView, Button, ImageView, Layouts
</LinearLayout>
</ScrollView>
I have a loading screen for my android app.
It's working ok if I only use background image or ProgressBar, but when I try to center both elements in the middle of the screen I get that:
So far my activityy_main.xml looks like that:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/mainLayout"
tools:context="com.siconet.axa.MainActivity" >
<RelativeLayout
android:id="#+id/loadingPanel"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/axa_logo" />
<ProgressBar
android:layout_width="250px"
android:layout_height="250px"
android:indeterminate="true" />
</RelativeLayout>
<WebView
android:id="#+id/webView"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</RelativeLayout>
What I want to achieve is something like this:
Try this layout
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/mainLayout"
tools:context="com.siconet.axa.MainActivity" >
<RelativeLayout
android:id="#+id/loadingPanel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<ProgressBar
android:layout_width="250px"
android:layout_height="250px"
android:layout_centerInParent="true"
android:indeterminate="true" />
</RelativeLayout>
<WebView
android:id="#+id/webView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
Hope this helps you.
Try adding to your progressBar this line android:layout_centerInParent="true"
Try using centerInParent instead. Something like...
<RelativeLayout
android:id="#+id/loadingPanel"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerInParent="true" > // right here
But I think a better approach would be to just use a LinearLayout.Try the below layout...
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/mainLayout" >
<LinearLayout
android:id="#+id/loadingPanel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent ="true"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/play"
android:layout_gravity="center_horizontal" />
<ProgressBar
android:layout_width="250px"
android:layout_height="250px"
android:background="#drawable/pause"
android:indeterminate="true" />
</LinearLayout >
<WebView
android:id="#+id/webView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:visibility="gone"/>
</RelativeLayout>
Take note of the different changes but this layout gives me the following ...
I don't see your ImageView in the second image so I centered them both. If you can explain where that should be then I can adjust this layout for that.
Try use Frame Layout instead of RelativeLayout in "loadingPanel"
Hi I am using a relative layout to align the image at the bottom but the image is giving away some margin at the top and at the bottom. My code is as below
<?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:background="#drawable/back" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:src="#drawable/compare1footer"
android:layout_alignParentBottom="true" />
</RelativeLayout>
</LinearLayout>
Can someone help me out with this. Thank you
I tried using Fllo answer and i am attaching the screenshot
I am uploading the png
I think it's because you use android:layout_alignParentTop="true" at the same time. You don't need a parent LinearLayout but you need to set your RelativeLayout height to match_parent. Try as follows:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/compare1footer"
android:layout_alignParentBottom="true"
android:scaleType="FIT_XY" />
</RelativeLayout>
As Rat-a-tat-a-tat Ratatouille suggested, I think it's the right way to avoid deformation with your image. The attribute scaleType according to the Reference is to:
Scale in X and Y independently, so that src matches dst exactly. This may change the aspect ratio of the src
It's not a bad idea.
try changing this:
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:src="#drawable/compare1footer"
android:layout_alignParentBottom="true" />
to
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scaleType="fitXY"
android:src="#drawable/compare1footer"
android:layout_alignParentBottom="true" />
Replace your code for Image View from:
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:src="#drawable/compare1footer"
android:layout_alignParentBottom="true" />
To:
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:src="#drawable/compare1footer"
android:adjustViewBounds="true"
android:layout_alignParentBottom="true" />
android:adjustViewBounds="true" is the solution of your problem.
Hope it will help you..
Try to change:
<?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:background="#drawable/back" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:src="#drawable/compare1footer"
android:layout_alignParentBottom="true" />
</RelativeLayout>
</LinearLayout>
to 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" >
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#drawable/ic_launcher" >
</ImageView>
</RelativeLayout>
The problem which i am facing is very strange relative layout is not warping width and height according to image.it is showing relativelayout on full screen as you can see Image
Code:
<?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="#drawable/img_bg_wood">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="#drawable/nine_man_morris" >
</RelativeLayout>
</RelativeLayout>
I solve the issue when i place ImageView in relative layout it works perfect as you can see Image.
Code:
<?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="#drawable/img_bg_wood">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:src="#drawable/nine_man_morris" />
</RelativeLayout>
</RelativeLayout>
But the problem is i don't want to use imageview because it is still shows RelativeLayout in full screen. i want to wrap relativelayout according to image just like the above code showing.
// 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:background="#drawable/img_bg_wood">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#drawable/nine_man_morris"
android:gravity="center">
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#A0000000"
android:clickable="true"
android:focusable="true">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<!-- The Background Image -->
<ImageView
android:layout_width="wrap_content"
android:scaleType="fitXY"
android:layout_centerInParent="true"
android:id="#+id/background_image"
android:layout_height="wrap_content"
android:src="#drawable/bg_pic"
/>
<!-- The view group containd around the image -->
<LinearLayout
android:orientation="vertical"
android:layout_alignBottom="#id/background_image"
android:layout_alignLeft="#id/background_image"
android:layout_alignRight="#id/background_image"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
This should solve your problem
My problem is may be trivial for other people, but for me I can't make it work. I have layout xml as follow.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="vertical"
>
<LinearLayout android:id="#+id/tracker_container"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="vertical"
/>
<ImageView
android:id="#+id/mainImageView"
android:contentDescription="#string/display"
android:layout_gravity="center"
android:layout_width="400dp"
android:layout_height="300dp"
android:opacity="translucent"
/>
</LinearLayout>
How can I make the ImageView is at the center of the whole screen?
Thanks
Try this--
<?xml version="1.0" encoding="utf-8"?>
<RelativeLaout 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"
>
<RelativeLayout android:id="#+id/tracker_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
/>
<ImageView
android:id="#+id/mainImageView"
android:contentDescription="#string/display"
android:layout_centerInParent="true"
android:layout_width="400dp"
android:layout_height="300dp"
android:opacity="translucent"
/>
</RelativeLayout>
You can use a RelativeLayout as the parent and use layout_centerInParent:
<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">
<LinearLayout android:id="#+id/tracker_container"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="vertical" />
<ImageView
android:id="#+id/mainImageView"
android:contentDescription="#string/display"
android:layout_centerInParent="true"
android:layout_width="400dp"
android:layout_height="300dp"
android:opacity="translucent" />
</RelativeLayout>
I'm not sure what that LinearLayout is for but I have kept it in there. Perhaps you are populating it programmatically and it's pushing your ImageView down. RelativeLayout ensures it will always be central to the parent, regardless of other view elements.