CODEWITHSUNDEEP
androidandroid-layout
eliocs
eliocs

Reputation: 18827

How to define layout element height as screen height

I'm trying to develop an Android layout where I have an Image and some text.

Desired layout

I want the image to be 1 screen tall and the rest of the content will be shown when scrolling down.

What value should I set in the layout.xml. So the image is exactly (device independent) 1 screen tall?

To make the question clearer, with css I could easily get a full height screen image with the following code:

<html>
    <style>
    html, body {
        height: 100%;
    }

    .image {
        height: 100%;
        background-image: url(http://kolobee.com/images/stings/baelo-claudia.1ovl/ad2p/620x620.jpg);
        background-position: center;
    }
    </style>
    <body>
        <div class="image"></div>
        <h1>Title</h1>
        <p>More text</p>
    </body>
</html>

Upvotes: 2

Views: 2151

Answers (3)

Flynn81
Flynn81

Reputation: 4168

You can achieve this with a custom view that overrides the onMeasure() method of the ImageView class. Below is the custom view, along with a layout that matches the image from your question.

(Note, this method does not take into account the amount of space an ActionBar would take up. If you are using one the custom view's on measure would need further tweaking.)

package com.example.testview;

import android.app.Activity;
import android.content.Context;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.view.WindowManager;
import android.widget.ImageView;

public class FullScreenImageView extends ImageView {

    private DisplayMetrics mMetrics;

    public FullScreenImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
        mMetrics = new DisplayMetrics();
    }

    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        WindowManager windowManager = (WindowManager) ((Activity)getContext()).getSystemService(Context.WINDOW_SERVICE);
        windowManager.getDefaultDisplay().getMetrics(mMetrics);
        setMeasuredDimension(mMetrics.widthPixels, mMetrics.heightPixels);
    }
}

And the layout xml would be something like:

<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="wrap_content"
        android:orientation="vertical" >

       <com.example.testview.FullScreenImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:scaleType="fitXY"                
            android:src="@drawable/ic_launcher" />

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Title" />

        <Text
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Text" />
    </LinearLayout>

</ScrollView>

Upvotes: 2

hitman_93
hitman_93

Reputation: 116

You could dynamically add Image View and set its height equal to screen height using this: If you want the the display dimensions in pixels you can use getSize:

Display display = getWindowManager().getDefaultDisplay();
Point size = new Point();
display.getSize(size);
int width = size.x;
int height = size.y;

If you're not in an Activity you can get the default Display via WINDOW_SERVICE:

WindowManager wm = (WindowManager) ctx.getSystemService(Context.WINDOW_SERVICE);
Display display = wm.getDefaultDisplay();
Display display = getWindowManager().getDefaultDisplay(); 
int width = display.getWidth();  // deprecated
int height = display.getHeight();  // deprecated

But for doing this you have to add Image View from java class something like this :-

ImageView iv = new ImageView();
parentLayout.Add(iv);

Upvotes: 1

bluesun
bluesun

Reputation: 1

<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"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity" >

<ScrollView 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    >
    <LinearLayout 
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        >
        <ImageView 
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            />
        <TextView 
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            />
        <EditText 
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            />
    </LinearLayout>
</ScrollView>

Upvotes: -2

Related Questions