Android Studio Layout. won't match parent - android

Everything looks fine in my previews but when I open the app in an emulator the layout doesn't match parent for length or width. Everything is where it should be within the layout it just doesn't stretch overall with the screen. This is happening in every layout in the app(I'm using fragments). To explain better heres pix:
** What is in the preview(and is what i want)
** What I have
here is the XML.
<?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:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="center"
android:src="#drawable/hlineand"/>
<TextView
android:id="#+id/userTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="User"
android:textAlignment="center"
android:textAppearance="#android:style/TextAppearance.Material.Small"
android:textColor="#android:color/darker_gray"
android:textSize="30dp"/>
<TextView
android:id="#+id/updateTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_alignParentStart="true"
android:text="----"
android:textAlignment="center"/>
<EditText
android:id="#+id/emailEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="22dp"
android:ems="10"
android:hint="e-mail"
android:inputType="textEmailAddress"
android:layout_below="#+id/userTextView"
android:layout_centerHorizontal="true"/>
<EditText
android:id="#+id/passwordEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignStart="#+id/emailEditText"
android:layout_below="#+id/emailEditText"
android:layout_marginTop="24dp"
android:ems="10"
android:hint="password"
android:inputType="textPassword"/>
<Button
android:id="#+id/loginButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/passwordEditText"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
android:text="Login"/>
</RelativeLayout>
This is my content main.xml. Like the first commenter mentioned, it was in there. It worked great when I put in match parent & match parent but not its resizing to some like width 344px & height 590px. Any way I can keep that as match parent??
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.a2.reach.MainActivity"
tools:showIn="#layout/app_bar_main">
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="344dp"
android:layout_height="495dp"
tools:layout_editor_absoluteY="8dp"
tools:layout_editor_absoluteX="8dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
</android.support.constraint.ConstraintLayout>

Fixed the content main XML by changing the width height to 0dp instead of match parent & adding the 4 constraints on the bottom of the frame layout. Thank you guys and thank you as well to #Du.fantasy for pointing me in the right direction so fast
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="0dp"
android:layout_height="0dp"
tools:layout_editor_absoluteY="8dp"
tools:layout_editor_absoluteX="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"/>

change the FrameLayout to match_parent from fix width and height
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.a2.reach.MainActivity"
tools:showIn="#layout/app_bar_main">
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:layout_editor_absoluteY="8dp"
tools:layout_editor_absoluteX="8dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
</android.support.constraint.ConstraintLayout>

As per my knowledge, In your first XML, Your are giving orientation="vertcial" to relative layout. If you want that it should work then you should use Linear layout and use orientation for that layout.
Try using like this in you content XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_blood_g_activity"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Mature Diabetic Patient"
android:layout_gravity="center"
android:textSize="15dp"/>
<View
android:layout_width="wrap_content"
android:layout_height="30dp"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Enter Your current Blood Sugar"/>
<View
android:layout_width="20dp"
android:layout_height="60dp"/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/cbs"
android:inputType="number"
android:hint="mg/dl"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Enter Your Target Blood Sugar"/>
<View
android:layout_width="20dp"
android:layout_height="60dp"/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tbs"
android:inputType="number"
android:hint="mg/dl"/>
</LinearLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Humalog/Novalog"
android:id="#+id/btnhnbs"
android:layout_gravity="center"/>
</LinearLayout>

in my variant change size parent Layout - fixed my problem
<FrameLayout
android:id="#+id/map_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
</FrameLayout>

Related

How to align two buttons and views left to center, center to right with

How do I create a layout with two buttons that can fill half of the layout from left and the second button on the right with also a view below as a border?
My layout
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorPrimary"
tools:context=".Login">
<RelativeLayout
android:gravity="center_horizontal"
android:layout_marginTop="70dp"
android:layout_marginBottom="70dp"
android:layout_marginStart="15dp"
android:layout_marginEnd="15dp"
android:background="#color/white"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="#dimen/_45sdp"
android:background="#color/white"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/btn_chat"
android:layout_alignParentLeft="true"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#color/white"
android:textColor="#color/colorPrimary"
android:textStyle="bold"
android:text="LOGIN" />
<Button
android:id="#+id/btn_cart"
android:layout_alignParentRight="true"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#color/white"
android:textColor="#color/lightDark"
android:textStyle="bold"
android:text="REGISTER" />
</RelativeLayout>
<View
android:id="#+id/active_border"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
android:background="#color/colorPrimary"
android:layout_width="wrap_content"
android:layout_height="1dp"/>
<View
android:id="#+id/inactive_border"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:background="#color/lightDark"
android:layout_width="wrap_content"
android:layout_height="1dp"/>
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
You could use the ConstraintLayout as the parent and set app:layout_constraintWidth_percent="0.5" in the child to make sure it takes the half of the width. Also use the constrain to make sure the buttons are on top of the border view.
For example the following code uses ConstraintLayout to achieve something similar:
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/btn1"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintBottom_toTopOf="#+id/borderView"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintWidth_percent="0.5" />
<Button
android:id="#+id/btn2"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#+id/borderView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintWidth_percent="0.5" />
<View
android:id="#+id/borderView"
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="#android:color/black"
app:layout_constraintBottom_toBottomOf="parent" />

How to prevent edit text from overlapping the view below?

I'm making a diary app. So I made a Linearlayout(I'll call this layout toolbox) of the tools needed to write like this image.
image
But I type text and edit text gets longer, toolbox overlap the bottom of an edit text. So can't see the text I'm typing.
I've done a lot of googling and I've used a way to add bottom margin to the layout, but it didn't work.
issue GIF here(Because it is hidden in the toolbox, can see the text I entered before, not the text I typing.)
There was this problem before I added a scroll view. I guess this problem isn't about scroll view.
How to prevent edit text from overlapping the view below?
Here's my XML
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".DiaryActivity">
<RelativeLayout
android:id="#+id/save_tap"
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#android:color/white"
android:orientation="horizontal"
app:layout_constraintBottom_toTopOf="#+id/top_line"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
//elements
</RelativeLayout>
<View
android:id="#+id/top_line"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:background="#D1D1D1"
app:layout_constraintTop_toBottomOf="#+id/save_tap" />
<ScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintTop_toBottomOf="#+id/top_line">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:orientation="vertical"
app:layout_constraintBottom_toTopOf="#id/toolbox">
<EditText
android:id="#+id/edit_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|start"
android:layout_marginTop="20dp"
android:background="#null"
android:hint="#string/hint_diary_title"
android:textColor="#android:color/black"
android:textSize="23sp" />
<EditText
android:id="#+id/edit_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:background="#null"
android:ems="10"
android:gravity="start|top"
android:hint="#string/hint_diary_contents"
android:inputType="textMultiLine"
android:textColor="#515151" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/toolbox"
android:layout_width="match_parent"
android:layout_height="45dp"
android:background="#drawable/top_dividing_line"
android:gravity="center|left"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
//image buttons
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
try to add a linear layout which takes both your Scrollview and your toolbox layout.
Also can you show all of ur xml (including the parent layout?)
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/save_tap"
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#android:color/black"
android:orientation="horizontal">
</RelativeLayout>
<View
android:id="#+id/top_line"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:background="#D1D1D1"
app:layout_constraintTop_toBottomOf="#+id/save_tap" />
<ScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#color/colorAccent"
android:fillViewport="true"
android:orientation="vertical"
app:layout_constraintTop_toBottomOf="#+id/top_line">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:orientation="vertical"
app:layout_constraintBottom_toTopOf="#id/toolbox">
<EditText
android:id="#+id/edit_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|start"
android:layout_marginTop="20dp"
android:background="#null"
android:textColor="#android:color/black"
android:textSize="23sp" />
<EditText
android:id="#+id/edit_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:ems="10"
android:gravity="start|top"
android:inputType="textMultiLine"
android:textColor="#515151" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/toolbox"
android:layout_width="match_parent"
android:layout_height="45dp"
android:background="#android:color/holo_blue_bright"
android:gravity="center|left"
android:orientation="horizontal">
</LinearLayout>
</LinearLayout>
I added some colors to display the different layouts
Tell me if this is the behaviour you wants

white backgroud for png Image in android studio

I'm trying to show some png images on RecyclerView, the images has transparent background but it show white background when run on device !!.
I tried to add
android:background="#android:color/transparent"
to ImageView, but still white
I use Picasso to load the image on ImageView, like that
Picasso.get()
.load(newpath)
.into(itemView.imgMCat)
this the fragment which contain the RecyclerView
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/meskback"
tools:context=".HomeFragment">
<!-- TODO: Update blank fragment layout -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="10">
<Toolbar
android:id="#+id/toolbar"
android:background="#color/meskBlue"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme"
android:popupTheme="#style/ThemeOverlay.AppCompat.Light"
tools:targetApi="lollipop">
<Button
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_gravity="right"
android:layout_margin="7dp"
android:id="#+id/mapiconbtn"
android:background="#drawable/mapicon"
/>
</Toolbar>
<LinearLayout
android:layout_weight="6"
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:weightSum="10"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:id="#+id/mainActivityRelayout1"
android:paddingTop="10dp"
android:layout_weight="5">
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
tools:srcCompat="#drawable/logo"
android:id="#+id/logoimg"
android:contentDescription="#string/logoimgdes"
android:src="#drawable/logo"
android:layout_centerHorizontal="true"
android:layout_marginTop="12dp"
/>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:layout_weight="5"
android:weightSum="2">
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:textSize="22sp"
android:layout_weight="1"
android:textStyle="bold"
android:gravity="center"
android:textColor="#color/meskBlue"
android:text="#string/welcome"
android:textAlignment="center"/>
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:textSize="20sp"
android:textStyle="bold"
android:gravity="center"
android:layout_marginTop="20dp"
android:text="#string/how_can_we_help_you"
android:textAlignment="center"/>
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_weight="4"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/McatRecylceView"/>
</LinearLayout>
</LinearLayout>
</FrameLayout>
and this is the item_view.xml which contain the ImageView
<?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:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_margin="10dp">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="140dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imgMCat"
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="#android:color/transparent"
android:layout_centerInParent="true"
android:layout_marginTop="3dp" android:layout_marginStart="3dp"
android:layout_marginEnd="3dp" android:layout_marginBottom="3dp"/>
<TextView
android:text="TextView"
android:id="#+id/mcategoryTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/imgMCat"
android:textAlignment="center"/>
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
this photo for device
I found the answer here the problem was from CardView
https://stackoverflow.com/a/45769769/2209611
I add these attribute and fix the problem
app:cardBackgroundColor="#android:color/transparent"
app:cardElevation="0dp"
try this
<android.support.v7.widget.CardView
android:scaleType="centerInside"
android:layout_width="34dp"
android:layout_height="34dp"
android:clipChildren="false"
android:clipToPadding="false"
android:elevation="12dp"
android:shape="ring"
app:cardCornerRadius="17dp">
<ImageView
android:id="#+id/avatar"
android:layout_width="49dp"
android:layout_height="49dp"
android:layout_marginLeft="-8dp"
android:layout_marginTop="-5dp"
android:src="#drawable/blank" />
</android.support.v7.widget.CardView>
the image loads without a problem, what you need to do is set the height and width to wrap content instead of having a fixed width and a match parent height, here's what you should do in the xml
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="80dp">
<ImageView
android:id="#+id/imgMCat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:layout_centerInParent="true"
android:layout_marginTop="3dp" android:layout_marginStart="3dp"
android:layout_marginEnd="3dp" android:layout_marginBottom="3dp"/>
<TextView
android:text="TextView"
android:id="#+id/mcategoryTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/imgMCat"
android:textAlignment="center"/>
</RelativeLayout>
by setting the main layout to the sizes u want and then setting the imageview to wrap the content of the png you will have solved your problem
however, i would suggest that u never use fixed sizes for any UI components ever due to the amount of different devices with different screen sizes, if you use a fixed dimension UI elements then it's bound to be ruined on 1 screen or the other

Working with android layout

I'm new to android and the positioning elements are way different than as it is for web.
So What I want to do is this:
Login: ______
Password: _____
What I can get is this, by setting the linearLayout to vertical orientation:
Login:
__
Password:
__
Or this, with horizontal orientation:
Login:_____Password:_____
How may I mix it and achieve what I need?
Current code:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/mainActivity"
tools:context=".MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Login:"
android:textSize="14pt"/>
<EditText
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/loginText"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Senha:"
android:textSize="14pt"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/passText"/>
</LinearLayout>
Nest your linearlayouts. Have a vertical top level linear layout, with 2 horizontal linear layouts inside, each of which does one line of your output.
First of all you should use sp instead of pt for android:textSize.
You can achieve your expected layout using Nested LinearLayout as follows:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/mainActivity"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Login:"
android:textSize="14pt" />
<EditText
android:id="#+id/loginText"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Senha:"
android:textSize="14pt" />
<EditText
android:id="#+id/passText"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
However a good practice would be to use ConstraintLayout, which reduces the view hierarchy, as follows:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/mainActivity"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context=".MainActivity">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login:"
android:textSize="14pt"
app:layout_constraintBottom_toBottomOf="#+id/loginText"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<EditText
android:id="#+id/loginText"
android:layout_width="wrap_content"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/textView2"
app:layout_constraintEnd_toEndOf="#+id/textView2"
app:layout_constraintStart_toEndOf="#+id/textView2"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Senha:"
android:textSize="14pt"
app:layout_constraintBaseline_toBaselineOf="#+id/passText"
app:layout_constraintStart_toStartOf="#+id/textView" />
<EditText
android:id="#+id/passText"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/textView2" />
</android.support.constraint.ConstraintLayout>
try this:
you can use linear layout for each block like text view and edit text and set linear layout orientation horizontal
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/linear_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Username"
android:paddingLeft="10dp"
android:textColor="#color/black"
android:textSize="18dp" />
<EditText
android:id="#+id/user_et"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Password:"
android:paddingLeft="10dp"
android:textSize="18dp"
android:textColor="#color/black"/>
<EditText
android:id="#+id/password_et"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:background="#color/black"
android:textColor="#color/white"
android:text="Login"
android:textSize="18dp"
android:textAllCaps="false"
android:layout_marginTop="10dp"/>
It's best practice if you can use ConstraintLayout to decrease layout hierarchy. Otherwise, you can use nested LinearLayout.
Usually on mobile you do not need to use label like in web. setHint on EditText should be enough to make the purpose of the fields clear for your users.
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/mainActivity"
tools:context=".MainActivity">
<EditText
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:hint="Username"
android:inputType="textEmailAddress"
android:id="#+id/usernameEditText"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password"
android:inputType="textPassword"
android:id="#+id/passwordEditText"/>
</LinearLayout>
You can also use the material text field if you want something like a label to be always there, https://material.io/design/components/text-fields.html
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/usernameEditText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textEmailAddress"
android:hint="Username"/>
</android.support.design.widget.TextInputLayout>

Prevent recycler view from taking up whole space

I am using RecyclerView in a fragment and have set it's height to wrap_content and with a button below it. But the problem is RecyclerView takes up the whole space and button is not visible. What is going wrong?
This is my xml file -
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:background="#fff"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/empty_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="17sp"
android:layout_marginTop="20dp"
android:visibility="gone"
android:text="You haven't added any names yet!"/>
<android.support.v7.widget.RecyclerView
android:id="#+id/names_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"/>
<Button
android:id="#+id/add_name"
android:layout_width="203dp"
android:layout_height="wrap_content"
android:layout_below="#+id/recycler_view"
android:padding="15dp"
android:textColor="#F3F3F3"
android:textSize="17sp"/>
</LinearLayout>`
You should set weight to the RecyclerView and change the height to 0dp
<android.support.v7.widget.RecyclerView
android:id="#+id/names_list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"/>
Wrap the RecyclerView and the Button in a LinearLayout, than add
android:layout_height="0dp"
android:layout_weight="1"
to RecyclerView.
Your code should look like:
<?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:background="#fff"
android:orientation="vertical">
<TextView
android:id="#+id/empty_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center"
android:text="You haven't added any names yet!"
android:textSize="17sp"
android:visibility="gone"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="false"
android:layout_alignParentEnd="true"
android:layout_below="#+id/empty_view"
android:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="#+id/names_list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"/>
<Button
android:id="#+id/add_name"
android:layout_width="203dp"
android:layout_height="wrap_content"
android:layout_below="#+id/recycler_view"
android:padding="15dp"
android:textColor="#F3F3F3"
android:textSize="17sp"/>
</LinearLayout>
</LinearLayout>

Categories

Resources