i have a problem with the linear layout of android.
i have something like this:
<?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" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/myimg"
android:contentDescription="#string/desc" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/a" />
<EditText
android:id="#+id/editText1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:inputType="number" />
</LinearLayout>
the problem is, that on some bigger devices everything is good. but on smaler devices i just see the image and the textview and edittext is not visible. and its not possible to scroll down.
how to avoid this?
Put the whole thing into a ScrollView. Nothing easier than that!
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/myimg"
android:contentDescription="#string/desc" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/a" />
<EditText
android:id="#+id/editText1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:inputType="number" />
</LinearLayout>
</ScrollView>
It is because LinearLayout is not supposed to scroll down automatically. If you want to make your views scroll, you should place the layout inside a ScrollView:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/myimg"
android:contentDescription="#string/desc" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/a" />
<EditText
android:id="#+id/editText1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:inputType="number" />
</LinearLayout>
</ScrollView>
Related
I want to create a view with two parts:
1. Avatar, which is always displayed at right/center_vertial on screen.
2. Name, which is always displayed at left on screen (do not overlap on Avatar).
<?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="horizontal" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/username" />
</LinearLayout>
<LinearLayout
android:id="#id/avatar"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="right|center_vertical"
android:orientation="vertical" >
<ImageView
android:id="#+id/avatar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|center_vertical"
android:scaleType="center"
android:src="#drawable/useravatar" />
</LinearLayout>
</LinearLayout>
The problem is when Name is too long, it overlaps on Avatar. How can I fix this problem?
You should use RelativeLayout and a android:layout_toLeftOf="#id/avatar" attribute for the TextView.
You're better off using a Relative Layout for this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/avatar"
android:text="Some User Name" />
<ImageView
android:id="#+id/avatar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_gravity="right|center_vertical"
android:scaleType="center"
android:src="#drawable/thumbr" />
</RelativeLayout>
I know I can use a LinearLayout to do this, but I have to use a RelativeLayout because I have another RelativeLayout that I need to anchor to the bottom of the overall layout, as sort of a "status" bar, and I want the title and text to be above the status bar, aligned to the top. Using a RelativeLayout was the only way I could get the status bar to work. The only problem is the title and text TextViews overlap each other and I need the text to be immediately below the title:
<?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">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:paddingTop="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
>
<RelativeLayout
android:id="#+id/status"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:paddingTop="10dp"
>
<TextView
android:id="#+id/status"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
/>
</RelativeLayout>
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/status"
android:layout_alignParentTop="true"
/>
<TextView
android:id="#+id/text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/title"
android:layout_alignParentTop="true"
/>
</RelativeLayout>
</FrameLayout>
You can use LinearLayout as a children of RelativeLayout.
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentTop="true">
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<TextView
android:id="#+id/text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
XML layouts are rendered in the order they are "read" in. So you would want to do something like this:
<?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">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:paddingTop="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
>
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/status"
android:layout_alignParentTop="true"
/>
<TextView
android:id="#+id/text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/title"
android:layout_alignParentTop="true"
/>
<RelativeLayout
android:id="#+id/status"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:paddingTop="10dp"
>
<TextView
android:id="#+id/status"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
/>
</RelativeLayout>
</RelativeLayout>
</FrameLayout>
I'd also wrap the two textViews in a linearLayout like someone else had mentioned. This will help you a lot.
Hope that helps.
Remove the android:layout_alignParentTop="true" from your text TextView. That'll solve your problem!
My design is like this: "Linearlayout start" "scrollview start" "scrollview end" "LinearLayout start" "LinearLayout end" "LinearLayout end". But second linear layout does not show in the screen.
code:
<?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"
>
<ScrollView
android:fillViewport="false"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/title" />
<TextView
android:id="#+id/date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/date" />
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/nasa" />
<TextView
android:id="#+id/description"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/description" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center">
<Button android:id="#+id/refresh" android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="#string/refresh">
</Button>
</LinearLayout>
</LinearLayout>
Thanks in advance
I found the solution. I need to add an extra attribute in ScrollView
<ScrollView android:layout_weight="1">
which prevent scroller to fill entire screen.
When your are using scrollView it needs to be as parent for the layout.
As per your code, follow the following code which was edited as per your requirement....
code:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:fillViewport="false"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/title" />
<TextView
android:id="#+id/date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/date" />
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/nasa" />
<TextView
android:id="#+id/description"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/description" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center">
<Button android:id="#+id/refresh" android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="#string/refresh">
</Button>
</LinearLayout>
</ScrollView>
Run the following code. It will execute...
<?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/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="EN LEZİZ KISIR TARİFİ BURADA"
android:textAppearance="?android:attr/textAppearanceLarge" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/kisir" />
<Button
android:id="#+id/button1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/malzemeler" />
<Button
android:id="#+id/button2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hazirlanisi" />
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fillViewport="true" >
<TextView
android:id="#+id/textView2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:singleLine="false"
android:text="#string/secenek" />
</ScrollView>
</LinearLayout>
When i click the button i want to be able to use the scrollView to be able to read the rest of the text and i kept text long in string values but i couldn't create scrollView. Where am i doing wrong? Thx.
You cannot use the scrollview inside the textview. You can use the scrollview instead of Linear layout. You are using scrollview in the wrong place.
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:singleLine="false"
android:text="Your Text" />
</LinearLayout>
</ScrollView>
In my app i have a custom dialog whose layout is like the following:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical"
android:scrollbars = "vertical"
android:scrollbarAlwaysDrawVerticalTrack = "true"
android:padding="10dp" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" >
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="blablabla...."/>
<ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="10dp" android:src="#drawable/book1"/>
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" >
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="blablablablablablablablabla..."/>
<ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="10dp" android:src="#drawable/book2"/>
</LinearLayout>
</LinearLayout>
</ScrollView>
That is, i show a list of two horizontally placed widgets: a TextView showing some text and an, adjacent to the text, an ImageView widget showing an image.
What i would like to do is to show the ImageView widgets in such a way that they are aligned, that is, the image 1 start at the same column of image 2.
How can i do that?
Thx!
I'm not exactly sure what you are hoping for, but I would do the following:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp"
android:scrollbarAlwaysDrawVerticalTrack="true"
android:scrollbars="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="blablabla...." />
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_alignParentRight="true"
android:src="#drawable/book1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/image1"
android:text="blablablablablablablablabla..." />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_below="#+id/image1"
android:layout_alignParentRight="true"
android:src="#drawable/book2" />
</RelativeLayout>
</ScrollView>
I changed it to a relative layout and used some attributes such as android:layout_below
and android:layout_alignParentRight="true to get these changes. I hope this helps.