Guys I have the code above which looks like this:
The issue is that I need to set the height hardcoded in order to make it visible.
What I want is to set the height till the bottom of my mainview.
Is this possible using the height attribute or do I need to use other attributes?
My current implementation looks like this:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".pkgFragment.LocationAddFragment">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/llLayoutAddLocation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/abLayoutAddLocation"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:orientation="vertical">
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:columnCount="2"
android:rowCount="1"
>
<com.google.android.material.switchmaterial.SwitchMaterial
android:layout_columnWeight="1"
android:layout_height="match_parent"
android:text="#string/vehicle_name"/>
<com.google.android.material.switchmaterial.SwitchMaterial
android:layout_columnWeight="1"
android:layout_height="match_parent"
android:text="#string/vehicle_name"/>
</GridLayout>
</LinearLayout>
<org.osmdroid.views.MapView
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_below="#id/llLayoutAddLocation"
>
</org.osmdroid.views.MapView>
</RelativeLayout>
</ScrollView>
I MapView's height/width doesn't need to be hardcoded. I checked the repo myself. You can use match_parent to fill up the whole bottom area. Here is the sample from the repo MapView Sample Layout .
I suggest, Instead of RelativeLayout, use LinearLayout as the child(only) of ScrollView and set the MapView Height to match_parent.
Your code will look like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/llLayoutAddLocation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:orientation="vertical">
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:columnCount="2"
android:rowCount="1"
>
<com.google.android.material.switchmaterial.SwitchMaterial
android:layout_columnWeight="1"
android:layout_height="match_parent"
android:text="#string/vehicle_name"/>
<com.google.android.material.switchmaterial.SwitchMaterial
android:layout_columnWeight="1"
android:layout_height="match_parent"
android:text="#string/vehicle_name"/>
</GridLayout>
</LinearLayout>
<org.osmdroid.views.MapView
android:layout_width="match_parent"
android:layout_height="match_parent"
>
</org.osmdroid.views.MapView>
</LinearLayout>
Edit:
I've edited the answer. Remove the scrollview and set the height and width of the Parent LinearLayout to match_parent.
Related
I am sorry, I am new to android xml part. I am setting my listview which is inside scroll view to full screen but its frame is still small. How to resolve it? I have already set both width and height to "match_parent". Can someone help?
<?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:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.stacktips.speechtotext.MainActivity">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:listitem="#layout/row" >
</ListView>
</ScrollView>
<LinearLayout
android:id="#+id/btnSpeakContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#f5f5f5"
android:gravity="center_horizontal"
android:orientation="vertical"
android:padding="20dp">
<ImageButton
android:id="#+id/btnSpeak"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:padding="16dp"
android:scaleType="fitCenter"
android:src="#mipmap/ic_microphone_2" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/btnSpeak"
android:layout_margin="10dp"
android:text="#string/hint" />
</LinearLayout>
</RelativeLayout>
Putting the ListView inside a ScrollView means the ListView will not go to its full height. Take out the ScrollView surrounding the ListView and this should work for you :) ListView itself is scrollable.
How does one lay out 3 views horizontally such that the outer 2 views are of fixed width and the middle view fills the remaining available horizontal space? All of my attempts to do this have resulted in the rightmost view being pushed off the screen.
I struggled for a while to get this working and found how how to do it with RelativeLayout. See code example below and pay close attention to the usage of layout_toRightOf, layout_toLeftOf, and layout_alignParentRight
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="#dimen/eventDetailSectionHeight"
android:background="#color/grayout">
<SomeFixedWidthView
android:id="#+id/leftFixedWidthView"
android:layout_width="100dp"
android:layout_height="match_parent"/>
<SomeVariableWidthView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="#id/leftFixedWidthView"
android:layout_toLeftOf="#+id/rightFixedWidthView"/>
<SomeFixedWidthView
android:id="#+id/rightFixedWidthView"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"/>
</RelativeLayout>
Try setting layout_weight for each child according to requirement.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1">
<View
android:id="#+id/leftView"
android:layout_width="0dp"
android:layout_weight="0.4"
android:layout_height="match_parent"
android:background="#ff0000"/>
<View
android:id="#+id/middleView"
android:layout_width="0dp"
android:layout_weight="0.2"
android:layout_height="match_parent"
android:background="#33cc33"/>
<View
android:id="#+id/rightView"
android:layout_width="0dp"
android:layout_weight="0.4"
android:layout_height="match_parent"
android:background="#ff0000"/>/>
</LinearLayout>
Use below code for your desired result
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<View
android:id="#+id/leftView"
android:layout_width="100dp"
android:layout_height="match_parent"
android:background="#ff0000"/>
<View
android:id="#+id/middleView"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#33cc33"/>
<View
android:id="#+id/rightView"
android:layout_width="100dp"
android:layout_height="match_parent"
android:background="#ff0000"/>
</LinearLayout>
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.
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>
I have a relative layout as child of Scrollview. I already tried a bunch of answers in here but the scroll isn't working.
That's my xml file:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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:scrollbars="none"
android:fillViewport="true"
android:background="#drawable/home_bg_branco" >
<RelativeLayout
android:id="#+id/relative_categoria"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/categoria_placeholder_slider_listview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="-3dp"
android:contentDescription="#string/home_placeholder_slider"
android:src="#drawable/home_placeholder_slider"
android:visibility="visible" />
<ImageSwitcher
android:id="#+id/home_imageswitcher_slider_listview"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_alignBottom="#id/categoria_placeholder_slider_listview"
android:layout_alignLeft="#id/categoria_placeholder_slider_listview"
android:layout_alignRight="#id/categoria_placeholder_slider_listview"
android:layout_alignTop="#id/categoria_placeholder_slider_listview"
android:scaleType="fitXY" />
<ListView
android:id="#+id/listViewCategoria"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/home_imageswitcher_slider_listview"
tools:ignore="NestedScrolling" >
</ListView>
<ImageView
android:id="#+id/categoria_cores_listview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/categoria_placeholder_slider_listview"
android:layout_alignParentEnd="true"
android:layout_alignParentLeft="true"
android:contentDescription="#string/img_cores"
android:src="#drawable/img_cores" />
<ImageView
android:id="#+id/categoria_destaque_listview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignStart="#id/categoria_placeholder_slider_listview"
android:contentDescription="#string/img_destaques"
android:src="#drawable/img_destaques" />
</RelativeLayout>
</ScrollView>
Another thing: i disabled the listview scroll to avoid conflicts.
Thanks in advance!
You should change layout_height of the RelativeLayout to match_parent:
<RelativeLayout
android:id="#+id/relative_categoria"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
Also remove android:fillViewport="true" from ScrollView.
In my project I have several ScrollViews exactly like this, and they work fine:
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
UPDATE
One last thing I can propose is to remove ListView from the ScrollView as it can interfere with layout and scrolling.
Add this line to your onCreate()
getActivity().getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE|WindowManager.LayoutParams.SOFT_INPUT_STATE_VISIBLE);