Android-layout does not work properly - android

I'm using file main.xml to design UI in Android. I don't know why the last TextView (id: ImageDescription) doesn't work. If I delete ImageView tag, the last TextView will work again.
Here is my screenshot. the first in when no ImageView tag, and the second when has ImageView
As you see, when has image, I cannot see line Image descriptor: a cartoon tiger.
Here is my main.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/imageTitle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/test_image_title"/>
<TextView
android:id="#+id/imageDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/test_image_date"/>
<ImageView
android:id="#+id/imageDisplay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/test_contentDescription"
android:src="#drawable/test_image"/>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/imageDescription"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/test_image_description"/>
</ScrollView>
</LinearLayout>
thanks for help me :)

You are adding your imageDescription textview below imageview and that too your scrollview has both with and hight as fill_parent, once try this
<TextView
android:id="#+id/imageDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/test_image_date"/>
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/imageDescription"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/test_image_description"/>
</ScrollView>
<ImageView
android:id="#+id/imageDisplay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/test_contentDescription"
android:src="#drawable/test_image"/>
I think image is too big, if it's the case try by specifying layout:weight parameter for both image and text view in proper percentage.

Try to change your XML part
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent">
to
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
because your ScrollView tries to be as big as your LinearLayout in height.

I have another answer for my question, I post here to whom have viewed my post and need more answers. That I use android:adjustViewBounds="true" Property :)

Related

Android how to overlap an ImageView on top of a LienearLayouy so that they have the same size?

Hi and thanks for any suggestion.
I need to put an ImageView to overlapp over a LinearLayout.
I have tried this:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/background"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<ImageView
android:id="#+id/backgroundimage"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="#drawable/gradient_box"
android:layout_gravity="center"
/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:orientation="vertical"
android:layout_gravity="center">
But this is the result I get (the ImageView shrinks to a single line)
I have tried using RelativeLayout, this is the result I get.
CLOSE, but the ImageView now expands to fill all the available space and does not "wrap content" as I need to.
The desired result would be like this:
PS: I cannot use android:background="image" because i need to change it at runtime.
You can use a Relativ Layout that contains the LinearLayout and then align the ImageView with the LinearLayout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/background"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/linear"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:orientation="vertical"
android:layout_gravity="center">
<ImageView
android:id="#+id/backgroundimage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/gradient_box"
android:layout_alignLeft="#id/linear"
android:layout_alignRight="#id/linear"
android:layout_alignTop="#id/linear"
android:layout_alignBottom="#id/linear"
android:layout_gravity="center"
android:scaleType="fitCenter" />
If you just want to set the image as a background you can just set a background image for the linear layout:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/background"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/blue" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:orientation="vertical"
android:background="#drawable/gradient_box"
android:layout_gravity="center">
PS: I cannot use android:background="image" because i need to change it at runtime.
Why not? Use setBackgroundResource.

android:layout_centerHorizontal="true" is not working in android

I am using this layout to make image and text in center.but its not working .i am simply using android:layout_centerHorizontal="true".why its not working i dont understand. can someone please help to solve this problem?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#ffffff">
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="70dp"
android:background="#drawable/image_tutorial1" />
<TextView
android:textSize="14dp"
android:id="#+id/title"
android:layout_below="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="#string/info4"
android:textColor="#000000"
android:textStyle="bold" />
</RelativeLayout>
In the layout, RelativeLayout's width is set to wrap-content, its not taking the entire available width at all. It's contents are being centered but their parent View is shrinking to fit around them.
try fill_parent for root:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
Also, a LinearLayout with orientation="vertical" and gravity="center_horizontal" will do the same, more easily.
With RelativeLayout use:
android:layout_centerInParent="true"
with
android:layout_width="wrap_content"
use [android:layout_centerHorizontal="true"] under RelativeLayout layout, then it will work
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
you using this wrong for your RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
it should be
android:layout_height="match_parent"
android:layout_width="match_parent"

UI-Relative layout

I am trying to create a UI using relative layout where in the UI should look as such:
In the top of the screen i have a TextView
followed by another TextView
followed by scroll view where in i have to display the text in the
scrollable format
in the end i have a imageview.
How can i achieve this.
I have tried using the combination of Relative and Linear Layout but the elements gets overlapped. Anyone have any suggestions on how to proceed?
<?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"
android:background="#drawable/background_main" android:id="#+id/g_description">
<TextView android:id="#+id/titleBar" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:background="#drawable/header"
android:layout_alignParentTop="true" android:gravity="center"
android:text="#string/aboutus" android:textAppearance="? android:attr/textAppearanceLarge"
android:textStyle="bold" />
<TextView android:id="#+id/wd_name"
android:layout_width="fill_parent" android:layout_below="#id/titleBar"
android:layout_height="wrap_content" android:textStyle="bold"
android:textColor="#FFFFFF" android:textSize="18dip"
android:background="#drawable/background_main" android:gravity="center" />
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrolltext" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_below="#id/wd_name"
android:padding="5dip">
<LinearLayout android:orientation="vertical"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/wd_description"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:textSize="14dip" android:textColor="#FFFFFF">
</TextView>
</LinearLayout>
</ScrollView>
<ImageView android:id="#+id/bottomBar" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:src="#drawable/bottom_bar"
android:layout_alignParentBottom="true" />
you can achieve it like this:
Take relative layout and put textview in it.
Take another textview and add this to it android:layout_below="id of the 1st textview".
Take scrollview and add this to it android:layout_below="id of the 2nd textview".
Take linear layout inside scrollview.
Put textview inside linear layout.
Take imageview and add this to it android:layout_below="id of the scrollview".
Now your layout is ready and if you get any error then let me know with your code....
If you have a series of elements that you want to flow down the screen, then it sounds like you just need a LinearLayout.
It goes as below. Placing a TextView inside scrollview will make it scrollable. Reset is selfexplanary.
<?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">
<TextView android:layout_height="wrap_content" android:layout_width="fill_parent" android:text="Below TOP TextView" android:id="#+id/TextView01" android:layout_alignParentTop="true"></TextView>
<TextView android:layout_height="wrap_content" android:layout_width="fill_parent" android:text="TOP TextView" android:id="#+id/TextView02" android:layout_below="#id/TextView01"></TextView>
<ScrollView android:layout_height="wrap_content" android:layout_width="fill_parent" android:fillViewport="true" android:layout_below="#id/TextView02">
<TextView android:id="#+id/textView1" android:layout_height="wrap_content" android:text="Scrollable textViewafkasjf;laksjflaskjf;lasjf;alsfjal;sfj;aslfj;aslfja;slfj;aslkfj;asldfj;aslkfjasl;dfj;a asfj aslfj asldfjk as;lfjk asfjka;sldf jl;asj df;asdfjasfj aslfj asljf asjfl;asfasj fasj f;asj flas jf;lasjf;asjkf;las f;asj df;as jf;lasjf ;asjf;asjf;asjf;asjf;asjf;jasf;asfja s;dfa;sf asf jf asf a; sldfja;slfj;asldfjk" android:layout_width="fill_parent"></TextView>
</ScrollView>
<ImageView android:src="#drawable/icon" android:layout_height="wrap_content" android:id="#+id/imageView1" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:layout_width="fill_parent"></ImageView>
</RelativeLayout>
It works fine with setting android:orientation="vertical" for each text view.

How to remove space in the gallery

I have two galleries.image gallery and a text gallery seperately.There is space at the beginning and end of both the galleries.All are in relative layout.I dont understand what is the problem.Please help.
I have posted my code also:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/main"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView android:text="Airing Now"
android:id="#+id/titletextview"
android:textSize="22dip"
android:textColor="#color/textcolor"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</TextView>
<Gallery
android:id="#+id/Gallery_image"
android:layout_below="#+id/titletextview"
android:spacing="15dip"
android:padding="15dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</Gallery>
<ImageView android:id="#+id/ImageView"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</ImageView>
<Gallery
android:id="#+id/gallery_text"
android:layout_below="#+id/Gallery_image"
android:layout_width="fill_parent"
android:layout_height="match_parent"
/>
</RelativeLayout>
I have space at the beginning and end of gallery view.
To combat this I usually change the LayoutParams programatically. Once you have your ImageView (in this instance called iv) in getView() you can do:
iv.setLayoutParams(new Gallery.LayoutParams(Gallery.LayoutParams.FILL_PARENT, Gallery.LayoutParams.FILL_PARENT));
iv.setScaleType(ScaleType.FIT_CENTER);
I guess that's because android:gravity="center_horizontal". Also android:padding="15dip" adds all four paddings. Add only paddingLeft and paddingRight.

Android: EditText next to ImageView - EditText as wide as possible

I'd like to have an EditText and an ImageView next to each other; the ImageView has a fixed width, the EditText should take the rest.
I try to do it via
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="wrap_content">
<EditText android:id="#+id/edit_select_stop" android:layout_width="fill_parent" android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView android:layout_gravity="center_vertical"
android:layout_width="39dp" android:minWidth="39dp"
android:layout_height="wrap_content" android:src="#drawable/icon_time"
android:id="#+id/image_select_time"></ImageView>
</LinearLayout>
</LinearLayout>
But now, the EditText takes the whole width and covers the Image.
How can I achieve that EditText "ends" before the ImageView?
You can also use RelativeLayout to accomplish it. Simply assign the properties
android:layout_toLeftOf="#+id/id_of_your_imageview"
android:layout_width="fill_parent"
to the EditText and
android:layout_alignParentRight="true"
to your ImageView while keeping the fixed value of the width.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:id="#+id/widget32"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android"
>
<EditText
android:id="#+id/edit_select_stop"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
>
</EditText>
<ImageView
android:id="#+id/image_select_time"
android:layout_width="39dp"
android:layout_height="wrap_content"
android:layout_weight="1"
>
</ImageView>
</LinearLayout>
Well I dont recommend to go for the relative layout..
for the code (2nd one) seems good but I'd like to add that you should set the gravity android:gravity="center_vertical"
This aligns the components and makes it look good for sure

Categories

Resources