Develop Reference

Android, fit an image and textview into the screen

I added a fragment with an ImageView, which is a PNG image, and a TextView just below it.
The fragment is showing fine but when I rotate the screen the image will take most of the screen and the TextView is partially cut.
Here's the 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">
<ImageView
android:id="#+id/shopping_cart"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/shopping_cart" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_below="#id/shopping_cart"
android:text="#string/no_data"
android:gravity="center"/>
</RelativeLayout>
I'm trying to find a way to resize the image in order to show both image and text in the screen

try using a scroll-view as the root element if u want to retain the same image size rather than resizing the image. Here's a small snippet -
<ScrollView
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:fillViewport="true">
<RelativeLayout
android:id="#+id/container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
(all your view elements)
</RelativeLayout>

<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/text_image_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
(Enter view here)
</LinearLayout>

Alright, so firstly ensure that you have the image for the ImageView in all densities. I would suggest that you use this attribute in your ImageView code:
https://developer.android.com/reference/android/widget/ImageView.ScaleType.html
The scale type defines how your image should scale according to the view. I faced a similar issue once, and i was able to solve it using this. Having said that, i have not seen the image you are using, so i cannot be very sure of it. But, i would say that you use:
android:scaleType="centerCrop"
you can find the definition of the attribute on the link provided above. Also, i do not know what devices you are targeting for your app, but its always good to keep views inside a scroll view so that they are visible even on a smaller screen.
Give it a try, if not by centerCrop, then maybe by some other attribute.
Cheers!!

Here is the 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:gravity="center">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/shopping_text"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:text="#string/no_data"/>
<ImageView
android:id="#+id/shopping_cart"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#id/shopping_text"
android:src="#drawable/shopping_cart"/>
</RelativeLayout>

Android - how to position this custom balloon view with RelativeLayout

Im stuck in getting this to work.
Look at the picture below, i want the bubble to be placed under the image.
And of course would like to be able to place the view wherever i like.
I think the problem is in the parent view so i add parent xml to .
Maybe i need to change RelativeLayout to something else,
I have tried many things but nothing works
.
Here is my xml for the bubble
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout android:id="#+id/frameLayout_balloon_gallery_activity_send"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView android:id="#+id/imv_balloon_gallery_activity_send"
android:src="#drawable/balloon_gallery"
android:scaleType="fitCenter"
android:layout_height="fill_parent"
android:layout_width="fill_parent"/>
</FrameLayout >
here is the parent that i insert the bubble into
.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:id="#+id/relativelayout_main_activity_back"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical">
<Gallery xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gallery_activity_back"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:spacing="2dip"
android:gravity="top"
android:paddingTop="20dip"
/>
<RelativeLayout
android:id="#+id/relativeLayoutinner_activity_back"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" >
<EditText
android:id="#+id/etx_addtext_activity_back"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:singleLine="false"
android:text="#string/string_enter_text_here"
/>
</RelativeLayout>
</RelativeLayout>

You will want to create a RelativeLayout that contains both the ImageView and the bubble inside it. Position the bubble below the ImageView using the position below attribute. From there you can move the RelativeLayout around wherever and the bubble will remain under the image.

Check out how the Quick Actions were implemented here http://www.londatiga.net/it/how-to-create-quickaction-dialog-in-android/. The functionality is similar to what you want.

How can I get my Android Gallery to fit within my Relative Layout?

I'm currently stuck on my landscape layout. I am implementing a Gallery, and would like it to fit the relative layout's height, and wrap the content via the width. I tried scaleType centerInside, messing with different types of layout_height/width.
Here's where the relevant part of my XML looks like (I apologize for the lack of formatting):
<?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:padding="10dip"
android:orientation="vertical">
<RelativeLayout
android:orientation="horizontal"
android:layout_height="wrap_content"
android:layout_width="fill_parent">
<Gallery xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gallery"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:scaleType="centerInside"
/>
Here is the image
of the cutoff.

I don't believe you can apply scaleType to a Gallery: looking at http://developer.android.com/reference/android/widget/Gallery.html I don't see scaleType as one of the supported attributes.
EDIT: You should apply the scaleType attribute on the ImageView you are putting in the Gallery.

I don't think wrap_content works well with the width of a Gallery view.
Instead use android:layout_toRightOf, it will ensure that the Gallery doesn't extend into the area of your textviews. The following code is an example, but I have not tested it.
<?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">
<LinearLayout
android:id="#+id/right_side"
android:layout_height="fill_parent"
android:layout_width="wrap_content"
android:layout_alignParentLeft="true">
*put your textviews here*
</LinearLayout>
<Gallery
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_toLeftOf="#id/right_side"
/>
</RelativeLayout>

screen with top banner, webview and bottom banner

I'm trying to create a very simple android screen with the following content: top banner, webview and bottom banner. for some reason, i can't do it. my xml look like:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:id="#+id/FrameLayout02"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:orientation="vertical"
android:fitsSystemWindows="true" android:isScrollContainer="false">
<ImageView android:layout_width="wrap_content" android:layout_above="#+id/Web"
android:layout_height="fill_parent" android:layout_gravity="top"
android:src="#drawable/logo"></ImageView>
<WebView android:layout_gravity="center" android:id="#+id/Web"
android:layout_height="fill_parent" android:layout_width="fill_parent"></WebView>
<ImageView android:layout_width="wrap_content" android:layout_below="#+id/Web"
android:layout_height="fill_parent" android:layout_gravity="bottom"
android:src="#drawable/logo"></ImageView>
</LinearLayout>
what is wrong?
Thanks,
Daniel

Short answer all is wrong. Your code is a mess.
Long answer. You are trying to have an ImageView above a WebView and at the bottom another ImageView. I'm not exactly sure what of the mistakes broke it but that's also not important. Take a look at my example XML code.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView android:id="#+id/topimage"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:src="#drawable/icon"/>
<ImageView android:id="#+id/bottomimage"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:src="#drawable/icon"/>
<WebView android:id="#+id/web"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/topimage"
android:layout_above="#id/bottomimage"/>
</RelativeLayout>
Now what my XML does is simple. It uses a RelativeLayout as a container to allow a more flexible child alignment. The ImageView called topimage will adjust its height to its content and fill the parent in width. It is aligned to its parents top. The second ImageView is similar with the only exception that it is pinned to its parents bottom. The WebView is aligned in between both ImageViews. It adjust it's height to the 'ImageView`s heights.
Try to always keep some kind of structure in your XML and also Java code so you and also others can throw a look at it without starting to cry.

Resize AlertDialog to fit image exactly

I have the following AlertDialog with an image inside it:
As you can see there is a small gap just above and just below the image. I'd like to remove that gap.
My layout xml looks like:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/alert_thumb_root"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView android:id="#+id/thumb"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>

Unless you create the whole dialog by your self, it's really difficult to control those kind of things. However, if you don't mind resizing the image, you could try something like:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/alert_thumb_root"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView android:id="#+id/thumb"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitXY"/>
</LinearLayout>

The best and easy way to achieve this programmatically is to
setAdjustViewBounds(true);
I am answering this now because I have spent many days on the solution and can't find the answer anywhere.