I need to make LinearLayout that overflow an android google map
as shown in this image any one has any idea how to make this
I need help ?
android google map and linearlayout above it
You can try use FrameLayput
<FrameLayout...>
<MapFragment.../>
<LinearLayout...>
// your layout
</LinearLayout>
</FrameLayout>
You can use RelativeLayout as parent layout.
<?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:orientation="vertical">
<fragment
android:id="#+id/mapFragment"
android:name="com.google.android.gms.maps.MapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true" />
<LinearLayout
android:id="#+id/topLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:orientation="horizontal">
</LinearLayout>
<LinearLayout
android:id="#+id/bottomLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:orientation="vertical">
</LinearLayout>
</RelativeLayout>
Related
I've placed a fragment tag on my page for a google map and a listview surrounded by a linear layout tag underneath the map. Does anyone know why my list view isn't scrolling. I set my listview fastscrollenabled setting to true and it still doen't scroll.
var locationService = new LocationService(_geoCoder);
listView.Adapter = new ListOfLocationAdapter(this, locationService.GetLatLongOfAddresses());
this.listView.FastScrollEnabled = true;
Here is the XAML I use for the layout.
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:rowCount="2"
android:columnCount="1">
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="300dp"
class="com.google.android.gms.maps.MapFragment" />
<LinearLayout
android:id="#+id/linearLayout1"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:id="#+id/List"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:cacheColorHint="#FFDAFF7F"/>
</LinearLayout>
</GridLayout>
Here is the listadapter 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="wrap_content"
android:minHeight="50dp"
android:orientation="vertical"
android:background="#ffffff">
<LinearLayout
android:id="#+id/Text"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:orientation="vertical">
<TextView
android:id="#+id/CustomerName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#000000"
android:textSize="20dip"
android:textStyle="italic"
android:paddingLeft="10dip" />
<TextView
android:id="#+id/Address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14dip"
android:textColor="#000000"
android:paddingLeft="10dip" />
</LinearLayout>
</RelativeLayout>
I tried removing the relativelayout tag, but that didn't do anything for me.
Set weight to your listview & set height to 0dp. This will make it auto-fill any remaining space, causing the internal items of the listview to scroll.
<ListView
android:id="#+id/List"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:cacheColorHint="#FFDAFF7F" />
When I move the linearlayout around both the fragment and listview the scrolling starts working. For some reason the linear layout was showing off of the bottom of the android layout making it look like it wasn't scrolling until I added more records.
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:rowCount="2"
android:columnCount="1">
<LinearLayout
android:id="#+id/linearLayout1"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="300dp"
class="com.google.android.gms.maps.MapFragment" />
<ListView
android:id="#+id/List"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:cacheColorHint="#FFDAFF7F" />
</LinearLayout>
</GridLayout>
I had the same problem. I just set layout_height of my ListView to match_parent value. This solved my problem.
I have some difficulties with designing my app. My screen should contain toolbar and some edit fields. these fields should be places in the upper part of the screen under the toolbar. In the end it should look like this (sorry for quality of the image):
For this I decided to break the screen height into four equals parts and to pose my edit fields in the second quarter. I tried to use the following code to acchieve this, but it doesn't help: all the smaller relative layouts take all the screen.
I also tried:
to substitute the parent Relative layout with Linear layout
to replace "fill_parent" with "wrap_content".
After these actions the smaller layouts simply disappear.
<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:baselineAligned="false" >
<include android:id = "#+id/toolbarLogo" layout="#layout/toolbar_logo"></include>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="0.25"
/>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="0.25"
>
<EditText
.../>
<EditText
...
/>
<Button
.../>
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="0.5"
/>
</RelativeLayout>
Could you help me please with this problem?
Change your root layout to be a LinearLayout and ensure that the orientation is set to vertical. Change the layout_width of the children to be 1. See code below for an example:
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#f00"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#0f0"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#00f"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#f0f"/>
</LinearLayout>
Try It.. Set
android:layout_weight="1"
for each LinearLayout and
set
android:weightSum="4"
for Parent LinearLayout and
Like This Example..
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="4">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#0ff"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#ff2"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#01a"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#101"/>
</LinearLayout>
</RelativeLayout>
You can use google library PercentRelativeLayout with this library you can set width, height and margin of your views by procentege which is great because in all screen they look the same and of course it is not hard to code it. Here example:
<android.support.percent.PercentRelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
app:layout_widthPercent="50%"
app:layout_heightPercent="50%"
app:layout_marginTopPercent="25%"
app:layout_marginLeftPercent="25%"/>
</android.support.percent.PercentRelativeLayout>
you must add this line in your build.gradle
dependencies {
compile 'com.android.support:percent:23.2.0'
}
Official documentation by Google https://developer.android.com/reference/android/support/percent/PercentRelativeLayout.html
And for your case should look maybe like this:
<RelativeLayout
android:id="#+id/firstLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_heightPercent="10%"
/>
<LinearLayout
android:id="#+id/secondLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="#+id/firstLayout"
android:orientation="vertical"
app:layout_heightPercent="40%">
<EditText
android:layout_width="200dp"
android:layout_height="60dp"/>
<EditText
android:layout_width="200dp"
android:layout_height="60dp"/>
<Button
android:layout_width="200dp"
android:layout_height="60dp"/>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="#+id/secondLayout"
app:layout_heightPercent="30%"
/>
</android.support.percent.PercentRelativeLayout>
Hope this helps.
My app have an activity with layuot like this
<RelativeLayout
android:id="#+id/layoutMain"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/backgroundchatfixed">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/layoutKhungChat"
android:id="#+id/svChat">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/layoutChat">
</LinearLayout>
</ScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/background_khungchat"
android:layout_alignParentBottom="true"
android:id="#+id/layoutKhungChat">
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/khungchat_chat"
android:layout_centerVertical="true"
android:id="#+id/etChatbox"/>
</RelativeLayout>
</RelativeLayout>
When i touch my Edittext, only layout "layoutKungChat" push up.
Any solution to push up also Scrollview above it?
Thanks.
Try adding this to the activity tag in the manifest:
android:windowSoftInputMode="adjustPan"
use this code
<RelativeLayout
android:id="#+id/layoutMain"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/backgroundchatfixed">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/background_khungchat"
android:layout_alignParentBottom="true"
android:id="#+id/layoutKhungChat">
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/khungchat_chat"
android:layout_centerVertical="true"
android:id="#+id/etChatbox"/>
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/layoutKhungChat"
android:id="#+id/svChat">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/layoutChat">
</LinearLayout>
</ScrollView>
the one in the last always be written over the other layouts so if you want like buttons to be above an image layout as an example write it inside of layout below the image
I have a problem to layout my view.
I want the "buttonsLayout" to dock at the bottom of the view. That is no problem, but my "buttonsLayout" overlays the "pager". I want that the "pager" stops, where the "buttonsLayout" begins.
I have read so many posts, but nothing helps. What is wrong ?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rootLayout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="#color/gray" >
</android.support.v4.view.ViewPager>
<RelativeLayout
android:id="#+id/buttonsLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:text="Left" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="Right" />
</RelativeLayout>
</RelativeLayout>
Add android:layout_above = "#+id/buttonsLayout" to your pager layout. So pager will never overlay buttons.
P.S. I cant see one more closing RelativeLayout tag in your xml...
After many hours I can't fix button on the bottom of activity. Either is invisible or at the top. I tried also without relative layout, I tried adding another linear layout, but I still don't know how set this button.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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=".News" >
<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="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/news" />
<WebView
android:id="#+id/webView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<Button
android:id="#+id/newsbutton"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:text="Chiudi" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
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" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/news" />
<WebView
android:id="#+id/webView1"
android:layout_below="#id/imageView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<Button
android:id="#+id/newsbutton"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_alignParentBottom="true"
android:text="Chiudi" />
</RelativeLayout>
First, you have a warning in Legacy Android Layout Editor, that either RelativeLayout or LinearLayout is useless. That should be a hint for you. Pay attention to warnings, they're helpful in most of the times.
Indeed, you can get rid of LinearLayout.
So, the solution is:
Remove LinearLayout.
Add android:layout_below="#+id/imageView1" to the WebView.
Add android:layout_alignParentBottom="true" to the Button.
Add android:contentDescription to ImageView.
Use #string instead of hardcoded strings.
Optional steps are not bolded, they will remove warnings.
Whole working code, tested under Android 4.1.2:
<RelativeLayout
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" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:contentDescription="TODO: DESCRIPTION"
android:src="#drawable/ic_launcher" />
<WebView
android:id="#+id/webView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/imageView1" />
<Button
android:id="#+id/newsbutton"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_alignParentBottom="true"
android:text="Chiudi" />
</RelativeLayout>
copy paste the following in your button component ;)
android:layout_marginBottom="147dp"
android:layout_marginTop="50dp"
android:layout_marginleft="50dp"
android:layout_marginRight="47dp"
play only with the numbers and Im sure ull get the hang of it :)
Just add android:layout_below="#id/webView1" in your button.
If you would use LinearLayout, you could set the Widget that should fill the empty space like this: layout_height="0dp" and layout_weight="1". This should do the job too.