I am very new to android programming and I am now trying to position a "circle ball" image file into the LinearLayout in the middle. So, I have tried making 7 LinearLayouts equally divided and I am trying to put an image at the bottom of the 4th LinearLayout. The code below shows that I have 7 LinearLayouts. How can I put a "circle ball" image at the bottom of the 4th LinearLayout? Also, is creating 7 LinearLayouts a good idea? The purpose of the ball would be to move the ball to the next LinearLayout when I click "next" Button.
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:layout_above="#+id/view">
<LinearLayout
android:id="#+id/layout1"
android:layout_weight="1"
android:layout_height="fill_parent"
android:layout_width="fill_parent"/>
<LinearLayout
android:id="#+id/layout2"
android:layout_weight="1"
android:layout_height="fill_parent"
android:layout_width="fill_parent"/>
<LinearLayout
android:id="#+id/layout3"
android:layout_weight="1"
android:layout_height="fill_parent"
android:layout_width="fill_parent"/>
<LinearLayout
android:id="#+id/layout4"
android:layout_weight="1"
android:layout_height="fill_parent"
android:layout_width="fill_parent"/>
<LinearLayout
android:id="#+id/layout5"
android:layout_weight="1"
android:layout_height="fill_parent"
android:layout_width="fill_parent"/>
<LinearLayout
android:id="#+id/layout6"
android:layout_weight="1"
android:layout_height="fill_parent"
android:layout_width="fill_parent"/>
<LinearLayout
android:id="#+id/layout7"
android:layout_weight="1"
android:layout_height="fill_parent"
android:layout_width="fill_parent"/>
</LinearLayout>
Layout you have posted is very badly designed layout. If image is all you want to show on the screen then directly just put the image in the LinearLayout and set layout's gravity to center.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match+parent"
android:gravity="center">
<ImageView ... />
</LinearLayout>
Or, if there are other views too in your layout and you want the image to be placed in the center then use RelativeLayout
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_centerInParent="true"
... />
</RelativeLayout>
IMO this is not a good approach having 7 nested layouts. If you want a view to be moved dynamically (let's say on click) you could use relative layout and then attach onClickListener to that view.
Using RelativLayout add Imageview as done below, if you want to move that image than for that You can use the onClick method and in that method change the src of the image views.
myImage.setImageResource(R.drawable.yourImage);
change your layout to :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/view"
android:orientation="vertical"
android:weightSum="7">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal" />
<LinearLayout
android:id="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal" />
<LinearLayout
android:id="#+id/layout3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal" />
<LinearLayout
android:id="#+id/layout4"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal" />
<LinearLayout
android:id="#+id/layout5"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal" />
<LinearLayout
android:id="#+id/layout6"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal" />
<LinearLayout
android:id="#+id/layout7"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal" />
</LinearLayout>
<ImageView
android:layout_width="350dp"
android:layout_height="100"
android:layout_alignParentBottom="false"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerHorizontal="true"
android:layout_marginEnd="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="300dp"
android:src="#drawable/cal" />
</RelativeLayout>
Related
When the application is launched layout is fine. But when the video is playing. the Layout of the button is moving up.
How to resolve this?
When the application is launched?
When the video is playing the button is moving upwards
Below I had placed the layoutfile.xml which i had been working on.
<?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:weightSum="1"
android:baselineAligned="false"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.3"
android:background="#android:color/background_dark">
<ListView
android:id="#+id/VideoList"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/darker_gray"
android:foreground="#android:color/background_light" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:weightSum="1"
android:layout_weight="0.7">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.9"
android:layout_gravity="center_vertical">
<VideoView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/videoView"
android:layout_gravity="center" />
</FrameLayout>
<Button
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.1"
android:text="New Button"
android:id="#+id/button"/>
</LinearLayout>
</LinearLayout>
You should make the LinearLayout(that contains FrameLayout and Button) height match_parent
No need for weight-sum, just make the layout_weights integers like 1 and 9 instead of 0.1 and 0.9
Also, fill_parent is deprecated, use match_parent instead.
You have a LinearLayout with single child. No need, just put ListView with same layout_params.
Lastly, your vertical LinearLayout on the right should have a height of match_parent.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:baselineAligned="false"
android:orientation="horizontal">
<ListView
android:id="#+id/VideoList"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:background="#android:color/darker_gray"
android:foreground="#android:color/background_light" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="7">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="9"
android:layout_gravity="center_vertical">
<VideoView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/videoView"
android:layout_gravity="center" />
</FrameLayout>
<Button
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="New Button"
android:id="#+id/button"/>
</LinearLayout>
</LinearLayout>
Edit: Fixed layout Params on LinearLayout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:baselineAligned="false"
android:orientation="horizontal">
<ListView
android:id="#+id/VideoList"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="3"
android:background="#android:color/darker_gray"
android:foreground="#android:color/background_light" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="7">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="9"
android:layout_gravity="center_vertical">
<VideoView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/videoView"
android:layout_gravity="center" />
</FrameLayout>
<Button
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="New Button"
android:id="#+id/button"/>
</LinearLayout>
</LinearLayout>
I have done changes in listview "layout_width" and "layout_height" both should be match_parent ,Now it is working
I want to create a layout like the below picture.
I have four linear layout and I want to separate them with the black lines same the picture.
How can I create this??
Add this between your horizontal layouts
<View
android:layout_width="5dp"
android:layout_height=“match_parent”
android:paddingTop=“16dp”
android:paddingBottom=“16dp"
android:background=“#android:color/black”/>
And this between you vertical ones
<View
android:layout_width=“match_parent"
android:layout_height=“5dp”
android:paddingRight=“16dp”
android:paddingLeft=“16dp"
android:background=“#android:color/black”/>
You’ll have to add these twice, as you have four layouts and hence four dividers.
if you wanted to do it with just layouts you could make a frame layout which layers layouts and then have two layouts for vertical and horizontal and then add your layout in. i think this might be what you are looking for as this will put the lines overtop over your other views.
<?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="horizontal">
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<YOUR LAYOUT HERE/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1">
<View
android:layout_width="fill_parent"
android:layout_height="5dp"
android:layout_gravity="center_vertical"
android:layout_margin="40dp"
android:background="#ff000000" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1">
<View
android:layout_width="fill_parent"
android:layout_height="5dp"
android:layout_gravity="center_vertical"
android:layout_margin="40dp"
android:background="#ff000000" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center_horizontal">
<View
android:layout_width="5dp"
android:layout_height="fill_parent"
android:layout_margin="40dp"
android:background="#ff000000" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center_horizontal">
<View
android:layout_width="5dp"
android:layout_height="fill_parent"
android:layout_margin="40dp"
android:background="#ff000000" />
</LinearLayout>
</LinearLayout>
</FrameLayout>
I'm trying to design something like that :
Currently i'm having issue putting the button at "the middle" of the two layouts reunion point. Is there a way i do this ?
Thanks.
Here is a way to do it
<?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:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#FF0000">
<!-- TO ADD CONTENT HERE -->
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#FFFF00"
android:weightSum="0.5">
<!-- TO ADD CONTENT HERE -->
</LinearLayout>
</LinearLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#000000"
android:text="TEST"
android:textColor="#FFFFFF"/>
</RelativeLayout>
OUTPUT:
You can change the layout height from android:layout_weight="0.5"
you can use RelativeLayout for your parent and try adding twoLinearLayouts , one below another and set their heights, now place a Button in your RelativeLayout and set android:layout_centerInParent="true" for your Button .
and if you want to use weight for layouts, instead of adding two LinearLayout to your RelativeLayout, add one LinearLayout with weightSum=100 and then add two LinearLayouts to it with custom weights.
for your case , you have to do sth like this :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="100" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="20"
android:background="#f00" >
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="80"
android:background="#0f0" >
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="100" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="20" >
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="test" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
I've a FrameLayout on my android app but I can't make to scrollable a part of this layout...I've tried some solutions to fix this problem, but I can't find a patch!
Pratically, I would like to see scrollable the linearlayout (maybe, linearlayout is not necessary) between Scrollview tags.
This is my xml:
<FrameLayout 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"
tools:context="com.robertot.timereport.com.robertot.timereport.Pages.YearlyStatFragment">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
// Some views to scroll
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/bottom_linear"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:layout_gravity="bottom"
style="#android:style/Widget.Holo.Light.ActionBar.Solid">
<Spinner
android:id="#+id/spnYearY"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:layout_marginLeft="8dp"/>
<ImageButton
android:id="#+id/btnFilter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_search"
android:background="#null"
android:layout_weight="1"
android:layout_gravity="center_vertical"/>
</LinearLayout>
</FrameLayout>
Thanks!! :)
In a FrameLayout all the content views are one on top of the other, so the normal behaviour is that the Linear Layout hides part of the previous Scrollview. Why don't you use a LinearLayout or a Relative Layout instead of the FrameLayout?
Thanks to #Fernando! I've solved my problem, as is:
<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"
tools:context="com.robertot.timereport.com.robertot.timereport.Pages.YearlyStatFragment">
<ScrollView
android:id="#+id/scrollyear"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
//Some views
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/bottom_linear"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:layout_gravity="bottom"
style="#android:style/Widget.Holo.Light.ActionBar.Solid">
<Spinner
android:id="#+id/spnYearY"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:layout_marginLeft="8dp"/>
<ImageButton
android:id="#+id/btnFilter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_search"
android:background="#null"
android:layout_weight="1"
android:layout_gravity="center_vertical"/>
</LinearLayout>
</LinearLayout>
You can surround the view that you want to be scrollable with a ScrollView, as below:
<ScrollView android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff">
// the views here that you want to make scrollable
</ScrollView>
I'm trying to make a LinearLayout that has three rows, each of equal height. I am making this using 3 LinearLayouts inside the main one, each with a layout_weight of 1.
The middle LinearLayout should contain an ImageView, TextView, ImageView, with weights of 1,2,1. To do this, inside the middle LinearLayout I created another 3.
I want the TextView to be double the size of each ImageView. If you see the code below, when layout_weight is 1 for the inner LinearLayouts I have no problems, the three appear of equal size. However when I set the middle one (with id=textLayout) to layout_weight=2, it completely disappears (as seen in the Eclipse graphical layout viewer) and only the two others are visible.
<?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"
android:background="#drawable/fondo"
android:gravity="center_vertical|center_horizontal">
<LinearLayout
android:id="#+id/LayoutTop"
android:orientation="horizontal"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="1">
</LinearLayout>
<LinearLayout
android:id="#+id/LayoutMid"
android:orientation="horizontal"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="1">
<ImageView
android:layout_height="fill_parent"
android:layout_width="fill_parent">
</ImageView>
</LinearLayout>
<LinearLayout
android:id="#+id/textLayout"
android:orientation="horizontal"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="2">
<TextView
android:text="Status"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</TextView>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="1">
<ImageView
android:layout_height="fill_parent"
android:layout_width="fill_parent">
</ImageView>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/LayoutBottom"
android:orientation="horizontal"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="1">
</LinearLayout>
</LinearLayout>
You don't need the additional layouts to space the middle row appropriately, and your weights are backwards. If you want the text to be 2x the outer images, you want it to 1, and the outer columns to be 1.5
<?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">
<LinearLayout android:id="#+id/LayoutTop"
android:orientation="horizontal" android:layout_height="0dp"
android:layout_width="fill_parent" android:layout_weight="1" android:background="#ffff0000"/>
<LinearLayout android:id="#+id/LayoutMid"
android:orientation="horizontal" android:layout_height="0dp"
android:layout_width="fill_parent" android:layout_weight="1">
<ImageView android:layout_height="fill_parent"
android:layout_width="fill_parent" android:background="#drawable/icon"
android:layout_weight="1.5" />
<TextView android:layout_height="fill_parent" android:id="#+id/TextView01"
android:layout_weight="1" android:text="Status" android:layout_width="fill_parent" />
<ImageView android:layout_height="fill_parent"
android:layout_weight="1.5" android:background="#drawable/icon"
android:layout_width="fill_parent" />
</LinearLayout>
<LinearLayout android:id="#+id/LayoutBottom"
android:orientation="horizontal" android:layout_height="0dp"
android:layout_width="fill_parent" android:layout_weight="1" android:background="#ff00ff00"/>
</LinearLayout>
I used an icon (if you have one) to put a picture in the middle row, and some colors in the top and bottom in to show the spacing more clearly.