linear layouts not spacing correctly - android

Hey im having trouble with these linear layouts in android xml. initially i did them in a relative layout and it worked fine, but after some research i discovered that relative layouts inside of a scrollview doesnt work supposedly. so now after much tweaking my imageview shows up but has a huge margin above and below it and my textview doesnt even show up aside from being where its supposed to in the graphics editor but blank.
so whats wrong? should i even be using a linear layout?
this is roughly what its supposed to look like http://www.mediafire.com/view/?z945tz2vrb2x46t
and this is what it looks like after Abdul and Ralgha's help as well as setting the base linear layout's height to wrap content http://www.mediafire.com/view/?px17q2z3yyeo8az
Thanks
<LinearLayout 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" >
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<TextView
android:id="#+id/today"
android:src="#string/today"
android:textSize="30dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
/>
<ImageView
android:id="#+id/image1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#drawable/weeklylist_blocks"
/>
</LinearLayout>
</ScrollView>
</LinearLayout>
`![screwed up layout][1]

Don't worry about weight right now, leave it removed. In your TextView, change "android:src" to "android:text" (without the quotes naturally). If that alone doesn't solve it, remove the textSize line and see what happens. If that works, then you can start playing with sizes (and weights if needed).
Also, textSize should be given in sp rather than dp. sp is for text, dp is for everything else, though that's not what is causing your problem.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<TextView
android:id="#+id/today"
android:textSize="30sp"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:text="#string/today"
/>
<ImageView
android:id="#+id/image1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/weeklylist_blocks"
/>
</LinearLayout>
</ScrollView>

android:layout_weight="1"
might be the cause of your problems

Its works like charm, Use the following coding to achieve your thing:
<LinearLayout 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:gravity="center_vertical"
android:orientation="vertical" >
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:fillViewport="true" >
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:orientation="vertical" >
<TextView
android:id="#+id/today"
android:src="#string/today"
android:textSize="30sp"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:text="#string/today"
/>
<ImageView
android:id="#+id/image1"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:contentDescription="#string/nissan"
android:src="#drawable/weeklylist_blocks" />
</LinearLayout>
</ScrollView>
</LinearLayout>

Related

Image does not touch the edges, Android [duplicate]

I am creating an Android app which has a main RelativeLayout and some LinearLayout within it.
Now i have this problem. When dragging items to the editor, e.g. a LinearLayout, it doesn't fit to the full width of the screen. How can I make this possible? This is my XML:
<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:fillViewport="true"
android:gravity="fill"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<LinearLayout
android:id="#+id/itemDetailLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:orientation="vertical"
android:fillViewport="true" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:id="#+id/itemImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minHeight="40dp"
android:minWidth="40dp"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/itemName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:text="Name"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical"
android:fillViewport="true" >
<TextView
android:id="#+id/itemRecentHigh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Recent High" />
<TextView
android:id="#+id/itemRecentLow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Recent Low" />
<TextView
android:id="#+id/itemAverage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Average" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/listViewLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/itemDetailLayout"
android:layout_marginTop="10dp"
android:fillViewport="true"
android:gravity="fill_horizontal"
android:orientation="vertical" >
<ListView
android:id="#+id/searchListView"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:fillViewport="true" >
</ListView>
</LinearLayout>
Added a screenshot for more info. Added blue background to have some contrast.
Replace this:
android:layout_width="wrap_content"
android:layout_height="wrap_content"
With
android:layout_width="match_parent"
android:layout_height="wrap_content"
into your LinearLayout or Remove all the Padding from main RelativeLayout
Removing padding makes the linear layout fit the entire screen of the device
The space between the blue part and the "end of the screen". On the sides and above the part where the back button and home button are.
Remove the padding from the root RelativeLayout.
Try
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical>
// Other views within the linear layout
</LinearLayout>
I suppose you are using Eclipse. Personally, I hate the Graphical Editor of Eclipse and I usually write the XML code directly because working with the editor is a real pain
Don't use fill_parent as it is deprecated.
Instead to your RelativeLayout set
android:layout_width="fill_parent"
android:layout_height="fill_parent"
Then, to the list view that you want to fill the rest of the screen, you can set this tags
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
By doing so, you are telling the XML that you want your ListView to do what fill_parent used to do in previous versions of Android.
Kind regards!
you should try something like the following :
<LinearLayout
android:id="#+id/itemDetailLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
...
</LinearLayout>
what i mean you should do this :
android:layout_width="fill_parent"
for every LinearLayout that you want its width to fill_parent .
FILL_PARENT means that the view wants to be as big as its parent as mentioned in the documentation .
and please give me some feedback
Hope That Helps .

Fill whole screen scrollview android

I have a problem to fill the whole screen with a scrollview.
How do I make the scrollview cover the whole screen width and screenheight? I tried with fillviewport but that that works for the screenheight.
I am not sure if its the scrollview or its parent (FrameLayout) that is the problem?
<?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"
android:orientation="vertical" >
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:fillViewport="true">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/img1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="img1"/>
<TextView
android:id="#+id/text_img1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
/>
<ImageView
android:id="#+id/img2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="img2"/>
<TextView
android:id="#+id/text_img2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
/>
<ImageView
android:id="#+id/img3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="img3"/>
<TextView
android:id="#+id/text_img3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
/>
</LinearLayout>
</ScrollView>
change your ScrollView and LinearLayout like this
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
Change your <ScrollView> from wrap_content to match_parent.
Example:
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center">
Also, you should be using match_parent instead of fill_parent in API 8+.
EDIT:
After talking a bit in the comments, OP and I discovered that the FrameLayout's default background is transparent, which means you can see the old view underneath.
Using a LinearLayout or really anything instead of a FrameLayout will fix this problem.
Other answers are going in the right direction but your main problem is probably due to the fact that it's a Dialog.
First of all make sure your Dialog is borderless. You can use one of approaches proposed here (not to duplicate answers).

Android place an image view between two views

I need to create a layout as shown in the image.
The rounded button with the arrow needs to be exactly between the blue and the gray background.
I'm having difficulties placing it without specifying the margins precisely, which is something I don't want to do because there is no guarantee it will look good on all resolutions and devices.
I would appreciate an xml sample for that
Thanks!
Use the desired drawable.. hope it works.. you can set width and height according to your need.
<?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" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:background="#1b96d9"
android:orientation="vertical" >
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#e6e6e6"
android:orientation="vertical" >
</LinearLayout>
</LinearLayout>
<ImageView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/arrow" />
</FrameLayout>
</LinearLayout>

How to make this layout in Android XML

I am novice in Android trying to make this layout:
Simply what I want to achieve:
The red container should take as much space as it needs but not as much that green container have to be shrinked. If there are too many items, red container will be scrollable. Green container is also always centered in orange one if there is space for it (if not it is actually still centered).
I don't know how to do it at all :( . Here is my try:
The problem is that I want to always maintain height of green container (minHeight does not work I can't understand why) and make the green container centered in orange one. I have problem with Scenario 2 (as you can see in the picture), this code works good in first scenario.
<LinearLayout 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:orientation="vertical">
<ScrollView
android:id="#+id/red_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/holo_red_dark"
android:scrollbarAlwaysDrawVerticalTrack="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<!-- Items are here -->
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/orange_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/holo_orange_dark"
android:gravity="center"
android:orientation="vertical">
<LinearLayout
android:id="#+id/green_container"
android:layout_width="100dp"
android:background="#android:color/holo_green_dark"
android:layout_height="50dp"
android:orientation="horizontal">
<!-- My content -->
</LinearLayout>
</LinearLayout>
</LinearLayout>
Edit: minHeight does not help:
Edit: image for user Illegal Argument:
Try setting property android:minHeight = "(whatever)dp" to orangeContainer. This worked for me in others "similiar" cases.
:)
Is this what you are looking for:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/list_items"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#android:color/background_dark" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/list_items"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:background="#android:color/darker_gray"
android:gravity="center"
android:minHeight="200dp"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
</RelativeLayout>
Snapshot in ecllipse:

layout_weight changes when I add a view into the layout (Android)

I am creating a design in Android for this list item:
I thought that the best solution would be create a linear layout with two relative layout inside it and a space. So I have tried to do it but I have a problem with weights.
In this picture you can see that I have added two relative layout with a space using layout_weight of linear_layout and the proportion works.
This is the code:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/fondo_chiste_lista_item"
android:weightSum="147"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_weight="41"
android:layout_height="0dp" >
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_weight="94"
android:layout_height="0dp" >
</RelativeLayout>
<android.support.v7.widget.Space
android:id="#+id/space1"
android:layout_width="wrap_content"
android:layout_weight="12"
android:layout_height="0dp" />
</LinearLayout>
But, now If I add a textview inside a relative layout proportions won't work. As you can see the boxes of the relative layouts have a different size.
This is the code:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/fondo_chiste_lista_item"
android:weightSum="147"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_weight="41"
android:layout_height="0dp" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="46dp"
android:text="TextView" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_weight="94"
android:layout_height="0dp" >
</RelativeLayout>
<android.support.v7.widget.Space
android:id="#+id/space1"
android:layout_width="wrap_content"
android:layout_weight="12"
android:layout_height="0dp" />
</LinearLayout>
So... What is the problem? Why the proportion change when I add elements? Is there any better solution?
I will add is as an answer since that fixed your problem
instead of
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
use something like
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"

Categories

Resources