This question already has answers here:
Assign width to half available screen width declaratively
(6 answers)
Closed 5 years ago.
I am having trouble to make my imageview appear half of the screen can someone help. here is my xml file. It should take up half of the screen size and also the linear layout with the textview should be at the footer of the imageview.
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/fond" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_below="#+id/relativeLayout1" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true" >
<WebView
android:id="#+id/webcontent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="151dp" />
</RelativeLayout>
<ImageView
android:id="#+id/image_actualitedetails"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:src="#drawable/six_yamaha" />
<LinearLayout
android:id="#+id/linearvideo"
android:layout_width="fill_parent"
android:layout_height="65dp"
android:layout_alignBottom="#+id/image_actualitedetails"
android:layout_alignParentLeft="true"
android:background="#88FFFFFF"
android:gravity="center"
android:paddingLeft="#dimen/fourdp"
android:paddingRight="#dimen/fourdp" >
<TextView
android:id="#+id/text_actualites"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textColor="#color/tabDark"
android:textStyle="bold" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="75dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#drawable/header" >
<Button
android:id="#+id/boutton_retour"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="14dp"
android:background="#drawable/back" />
</RelativeLayout>
Use LinearyLayout to wrap your ImageView and another invisible View, and set layout_weight both to 0.5, then the ImageView should be half the size.
Here is an example for you showing how to set the image half the screen size
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
android:background="#ff0000"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/your_image"
android:adjustViewBounds="true"
/>
</RelativeLayout>
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
android:background="#00ff00"
/>
</LinearLayout>
And this is the result
If you want to put your image in center of the screen, you can use the same idea and set proper weight to achieve your goal. Good luck!
Just if someone wants landscape version its almost the same :)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:baselineAligned="true"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#ff0000" >
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="#drawable/adele" />
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#00ff00" />
</LinearLayout>
First you'll need to get the display dimensions at runtime
Display display = getWindowManager().getDefaultDisplay();
Point size = new Point();
display.getSize(size);
windowWidth = size.x;
windowHeight = size.y;
Then you can go ahead and set your imageView height and width parameters to half of those values
int orgWidth = yourImageView.getDrawable().getIntrinsicWidth();
int orgHeight = yourImageView.getDrawable().getIntrinsicHeight();
//Use RelativeLayout.LayoutParams if your parent is a RelativeLayout
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
windowHeight / 2, windowWidth / 2);
yourImageView.setLayoutParams(params);
yourImageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
You have to put your imageview inside a LinearLayout with horizontal alignment, so you can use
android:weight = 0.5// this attribute for the image view will force the image to fill half of the screen, counting of course with the linear layout as the top parent layout(filling the hole window)
Related
I want a View that can have a minimum height or wrap_content if screen size is small and if screen size is large then occupy the rest of the space. This view is middle child of its parent.
Currently, I am using weight with LinearLayout. It's working fine with large screen but on a small screen its not showing the view.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/main_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/speaker_detail_background"
android:clickable="true"
android:paddingLeft="#dimen/padding_7dp"
android:paddingRight="#dimen/padding_7dp"
android:orientation="vertical"
>
<ImageView
android:id="#+id/down_arrow_image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:padding="#dimen/padding_15dp"
android:src="#drawable/down_arrow_icon" />
<RelativeLayout
android:id="#+id/lytSpeakerDetails"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/down_arrow_image_view"
android:minHeight="200dp"
android:layout_weight="1"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true">
<RelativeLayout
android:id="#+id/title_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark"
android:visibility="visible"
>
<com.harman.jblconnectplus.ui.customviews.CustomFontTextView
android:id="#+id/speaker_name_title_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#android:color/transparent"
android:drawableLeft="#drawable/edit_name"
android:drawablePadding="#dimen/padding_5dp"
android:ellipsize="end"
android:maxLength="16"
android:text="#string/speaker_name"
android:textColor="#android:color/white"
android:textSize="#dimen/textSize_18sp"
app:font="#string/font_name_opensans_semi"
/>
<com.harman.jblconnectplus.ui.customviews.CustomFontTextView
android:id="#+id/setting_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/speaker_name_title_textview"
android:layout_centerHorizontal="true"
android:text="#string/setting"
android:visibility="invisible"
android:textColor="#color/white"
android:textSize="14sp"
app:font="#string/font_name_opensans_semi"
/>
</RelativeLayout>
<LinearLayout
android:id="#+id/lytSeekBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_below="#id/title_bar"
android:layout_marginLeft="#dimen/brightness_margin"
android:layout_marginRight="#dimen/brightness_margin"
android:visibility="visible">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/darker"
android:layout_gravity="center_vertical"
/>
<SeekBar
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:id="#+id/seekBar"
android:thumb="#drawable/knob"
android:progressDrawable="#drawable/seekbar_progressbar"
android:indeterminate="false"
android:splitTrack="false"
android:maxHeight="3dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:progress="0"
android:secondaryProgress="0"
android:max="255"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/brighter"
android:layout_gravity="center_vertical"/>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:id="#+id/bottom_details_layout"
android:layout_height="wrap_content"
android:background="#drawable/round_border_white_bg"
android:orientation="vertical"
android:layout_marginTop="#dimen/margin_20dp"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="#dimen/padding_5dp"
android:gravity="bottom">
<include layout="#layout/speaker_detail_firmware_layout" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="0.5dp"
android:background="#color/divider_view" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include layout="#layout/speaker_detail_voice_layout" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
Please suggest.
Your View is being constrained. minHeight is not guaranteed to be honored if the View is constrained. See the documentation.
android:minHeight
Defines the minimum height of the view. It is not guaranteed the view will be able to achieve this minimum height (for example, if its parent layout constrains it with less available height).
Maybe a ScrollView is something that you can use since it gives you virtually unlimited space. The question is what you want to happen when space becomes an issue and everything just can't fit.
i had solve this problem. set weight "1" of layout in XML File(in my
case XML is same as Given above), it will work in case of if Screen
size is large and also check grammatically if size of view is less
than a minimum size then set height of view grammatically. sample
code:-
Set ViewTreeObserver to View:-
lytSpeakerDetails = (RelativeLayout) view.findViewById(R.id.lytSpeakerDetails);
ViewTreeObserver viewTreeObserver = lytSpeakerDetails.getViewTreeObserver();
viewTreeObserver.addOnGlobalLayoutListener(globalLayoutListener);
and in Listener's callback check if layout height is less than minimum then set height to minimum:-
ViewTreeObserver.OnGlobalLayoutListener globalLayoutListener = new ViewTreeObserver.OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
if (!isAdded())
return;
lytSpeakerDetails.getViewTreeObserver().removeGlobalOnLayoutListener(this);
int height = lytSpeakerDetails.getMeasuredHeight();
LinearLayout.LayoutParams imgViewParams = (LinearLayout.LayoutParams) lytSpeakerDetails.getLayoutParams();
/* imgViewParams.setMargins(0, (int) ( x * 1.5f) + (int) getResources().getDimension(R.dimen.card_shadow_y), 0, (int) x );
lytSpeakerDetails.setLayoutParams(imgViewParams);*/
if(height < (int)getResources().getDimension(R.dimen.brightness_minimum_height)) {
LinearLayout.LayoutParams rel_btn = new LinearLayout.LayoutParams(
ViewGroup.LayoutParams.WRAP_CONTENT, (int) getResources().getDimension(R.dimen.brightness_minimum_height));
lytSpeakerDetails.setLayoutParams(rel_btn);
}
}
};
I have a imageView and a linear layout inside a linear layout. It looks like this:
What I want to happen is have the second linear layout with all of the buttons and params be a fixed height, and then have the image view height be dynamic depending on whatever the size of the screen is. So if there is a large screen then the image will be large and the button and sliders will always be the same.
Here is a snippet of what I have:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
>
<ImageView
android:id="#+id/imgPreview"
android:layout_width="match_parent"
android:layout_height="400dp"
android:visibility="visible"
android:layout_gravity="center_vertical|right"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:scaleType="centerCrop"
/>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="fill_parent">
Is there an easy way to do this?
You can do this by giving the ImageView a layout_height of 0dp and setting its layout_weight to 1. The inner LinearLayout will have its layout_height set to wrap_content.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" >
<ImageView
android:id="#+id/imgPreview"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:visibility="visible"
android:scaleType="centerCrop" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Your button and slider content here>
</LinearLayout>
</LinearLayout>
Yes, you can do this using:
android:layout_height="0dp"
android:layout_weight="YOUR VALUE"
I am solving a problem with image and text in one scroll view. The main problem is, that I get different image height from server side . But the place with image should be all the time same.
Now the height of image place is dynamic. The text should be scrollable with the image.
Is there any possibility how to make the image height static?
Thank you!
EDIT
<?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" >
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/article_gallery"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="4" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<ImageView
android:id="#+id/article_image_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="#drawable/sipka_l" />
<ImageView
android:id="#+id/article_image"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1" />
<ImageView
android:id="#+id/article_image_next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="#drawable/sipka_p" />
</LinearLayout>
<TextView
android:id="#+id/image_desc"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#color/tran_dark_gray"
android:gravity="center"
android:padding="#dimen/size_8"
android:textAppearance="#style/xsmallLight" />
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="6"
android:background="#color/opaq_light"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="#dimen/size_16" >
<TextView
android:id="#+id/article_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="#dimen/size_12"
android:textAppearance="#style/normalBold" />
<TextView
android:id="#+id/article_body"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="#style/xsmall" />
</LinearLayout>
</ScrollView>
</LinearLayout>
</FrameLayout>
If you declare the ImageView with a fixed width and height it will remain static all the time.
Try something like:
<ImageView
android:id="#+id/imageView1"
android:layout_width="50dp"
android:layout_height="50dp"
/>
Put this ImageView inside a ScrollView and ofcourse put your TextView inside the same ScrollView.
you can use layout weights for your linearlayout. Set the width to 0 and let the weight determine actual size. Setting weight to 0.33 each gives each images 1/3 of the screen.
Or you could set one to 0.5 and the others to 0.25 each or whatever makes sense for your app.
Set the 3 images as:
<ImageView
android:id="#+id/article_image_back"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.33"
android:layout_gravity="center_vertical"
android:src="#drawable/sipka_l" />
In my application I have a title(TextView) and an Image. The image is grabbed from the web and most of the images are different sizes. Some of these images are to tall and overlap on top of my textview, covering it up. Is there anyway to prevent this?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/screen"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<android.gesture.GestureOverlayView
android:id="#+id/gestures"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1.0"
>
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text=""
android:paddingBottom="10px"
android:layout_weight="1.0"
/>
<ImageView
android:id="#+id/picview"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:padding="10px"
android:cropToPadding="true"
android:layout_weight="0.0"
/>
</android.gesture.GestureOverlayView>
</LinearLayout>
I think problem is at android:layout_height="fill_parent" because you have created imageview whose height is matched with parent view, so pls make it "wrap_content" instead of "fill_parent".
Edit:
If you want the the display dimensions in pixels you can use
Display display = getWindowManager().getDefaultDisplay();
int width = display.getWidth();
int height = display.getHeight();
I'm loading navigation from a website, where each item has a title, description, and image. I want to have all of the titles and descriptions centered along the same axis.
I'm using the following layout for each item in a ListView. It works fine when the images are half as wide as they are tall, but not if they are any wider - the text goes under the image.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:orientation="horizontal">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<TextView
android:layout_height="wrap_content"
android:textSize="10pt"
android:id="#+id/title"
android:gravity="center_horizontal"
android:layout_width="fill_parent" />
<TextView
android:layout_height="wrap_content"
android:id="#+id/description"
android:layout_width="fill_parent"
android:gravity="center_horizontal" />
</LinearLayout>
<View
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="3" />
</LinearLayout>
<ImageView
android:id="#+id/icon"
android:adjustViewBounds="true"
android:layout_width="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_height="wrap_content" />
</RelativeLayout>
Is it possible to force the image to stay at 25% of the RelativeLayout's width or less?
This can't be done in the XML. You would have to specify the size in the code. I would do that in the onCreate() of the activity:
import android.widget.LinearLayout.LayoutParams;
...
obj.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT,
LayoutParams.WRAP_CONTENT,
0.25f));
This means use 100% of the parent's height but 25% of the parent's width.