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();
Related
I am beginner and I what add a text that will change if it was seen in a smaller mobile
I pasted here
<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:background="#1d72c3"
android:gravity="center"
tools:context=".main" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:orientation="vertical" >
<TextView
android:id="#+id/abus"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:text="#string/aboutus"
android:textColor="#ffffff" />
</LinearLayout>
</RelativeLayout>
In the picture, I want it to look like Pic1 and Pic2, the problem is, Im making it like Pic3 and I don't want that!
Please update your xml.
<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:background="#1d72c3"
android:gravity="center"
tools:context=".main" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:orientation="vertical" >
<TextView
android:id="#+id/abus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/aboutus"
android:textColor="#ffffff" />
</LinearLayout>
</RelativeLayout>
Main problem is your textView's width is `"fill_parent". Your texts fill screen because of that.
The problem here is the way you have setup your layout is not the right solution if you wan't to have different layouts for different screens. Your outermost view is a Relative layout with width and height set to fill the screen (that's what fill parent does). Now inside that Relative Layout you have a LinearLayout with width and height set to match its parent (RelativeLayout). So this is also filling your screen. Now inside that you have a text view with width and height set to fill it's parent (LinearLayout), and since LinearLayout is taking full screen, your TextView will fill the whole screen.
The best way to support smaller screen is that in your res directory create a layout-small folder and place the same xml layout file in there but change the dimensions of your textView. If you want the text to be as large as its size, you can do "wrap_content" for both width and height. You can also specify android:textSize in dp to play around with different font sizes.
Try using relative units. I really recommend you to read this:
Supporting Multiple Screens
To make a long story short, using "sp" units is the way to go. use the attribute
android:textSize="15sp"
replacing 15 by the size you think it is the most appropriate for your needs.
Try this:
<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:background="#1d72c3"
tools:context=".main" >
<LinearLayout
android:layout_width="match_parent"
android:layout_centerInParent="true"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/abus"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:text="text"
android:textColor="#ffffff" />
<TextView
android:id="#+id/abus"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:text="text"
android:textColor="#ffffff" />
<TextView
android:id="#+id/abus"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:text="text"
android:textColor="#ffffff" />
<TextView
android:id="#+id/abus"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:text="text"
android:textColor="#ffffff" />
</LinearLayout>
</RelativeLayout>
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)
I want to display a set of images in GridView (They have the same dimensions).
Below the layout for the GirdView and the GirdView Item ..
Teh problem is that the image height is stretched. why ?
GridView layout :
<GridView
android:id="#+id/gvRecipes"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_below="#+id/include1"
android:layout_margin="0dp"
android:background="#drawable/bg"
android:gravity="right"
android:horizontalSpacing="10dp"
android:padding="0dp"
android:verticalSpacing="5dp" >
</GridView>
GridView item is :
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/include21"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="10dp"
android:background="#drawable/btn"
android:padding="5dp" >
<ImageView
android:id="#+id/imgRecibeImage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitXY"
android:src="#drawable/img1" />
<TextView
android:id="#+id/txtRecibeName"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_gravity="bottom"
android:background="#80000000"
android:gravity="right"
android:padding="5dp"
android:text="Crispy Chicken and Sandwich"
android:textColor="#ffffff"
android:textSize="17sp" />
</FrameLayout>
In your scale type you have used fitXY:
fitXY: This one should only be used if disproportionate scaling does not affect the graphic. In the case of bitmap graphics, this is almost always bad to use. This sets the width of the source image to the width of the view, and the height of the source image to the height of the view, without maintaining the aspect ratio of the source image.
Now your layout and imageview width is match_parent, so the image will be shown in full width of your parent view, but for height it is wrap_content so the imageView will adjust the actual height of your each and every image.
I have a square drawable image (drawable-l is 1280x1280) and I want it to crop depending on which direction the device is in (landscape, portrait). I want the image to always be centered, scaled to fill the largest side, and have the smaller side clipped.
Is this possible?
EDIT:
Adding on to Pramod J George's answer below, if you take the ImageView with the scaleType:centerCrop and put it along side your main layout inside of a FrameLayout, this will work perfectly!
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/background"
android:scaleType="centerCrop"
android:src="#drawable/background" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/logo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:contentDescription="#string/logo"
android:src="#drawable/logo" />
</LinearLayout>
</FrameLayout>
I think this will do some help
http://blog.andresteingress.com/2011/09/22/to-scale-or-not-to-scale/
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.