I made a layout for my app using linear layout. It looks fine and works fine but on rotation the layout changes very differently like the edit text becomes very small and disappears when keyboard appears. So how to provide a consistent look for my application. Or what am I missing?
Here is the code of the layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="vertical"
tools:context="com.example.nobodyme.errorrepository.MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:background="#F5F5F5"
android:elevation="3dp"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:layout_marginTop="16dp"
android:text="Folders"
android:textAppearance="?android:textAppearanceLarge"
android:textColor="#android:color/background_dark" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:gravity="center"
android:orientation="horizontal"
android:layout_marginBottom="16dp">
<EditText
android:id="#+id/foldername"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="4dp"
android:layout_weight="4"
android:background="#android:color/background_light" />
<Button
android:id="#+id/enterFolderButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_weight="1"
android:text="OK"
android:textColor="#android:color/background_light"
android:background="#000000" />
</LinearLayout>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="5">
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/folderlistview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:cacheColorHint="#color/colorPrimary" />
<TextView
android:id="#+id/empty_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Create folders to add error"
android:textAppearance="?android:textAppearanceMedium" />
</RelativeLayout>
</LinearLayout>
Here how it looks on my device, four images below show how it looks on vertical and horizontal position with and without clicking on edit text, i.e with keyboard on and off.
Related
Based on this layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/lytContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:gravity="center_vertical|center_horizontal"
android:orientation="vertical">
<Button
android:id="#+id/scanButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/scan" />
<TextView
android:id="#+id/authorship"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:text="" />
</LinearLayout>
I'd like to keep the Scan Button centered horizontally keeping the screen ratio, so it's always kept in the middle of the screen.
Next, I'd like to have the TextView centered on the bottom of the screen and centered too, like this:
Seems like the property and value of android:gravity="center_vertical|center_horizontal" I have on the LinearLayout is stopping me from having it so, but I have no idea how to proceed.
Here the code snippet here I hope this work for you as per your need...
<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="match_parent"
tools:context=".MainActivity"
android:weightSum="1"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_gravity="center_vertical"
android:gravity="center"
android:layout_weight="1"
android:orientation="vertical"
android:layout_height="wrap_content">
<com.google.android.material.button.MaterialButton
android:layout_width="wrap_content"
app:cornerRadius="10dp"
android:paddingHorizontal="10dp"
android:textSize="16sp"
android:text="Scan Product"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_weight="1">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Hello World!"
android:gravity="center"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
</LinearLayout>
I need to add some buttons at the bottom of a RecyclerView but whatever i do it always takes up the whole space and the buttons wont show on screen.
I tried adding padding that's the same size as the height of the buttons but it doesn't work.
<?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">
<LinearLayout
android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="20dp"
android:gravity="top|center"
android:orientation="horizontal">
<ImageView
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_marginEnd="10dp"
android:gravity="center"
android:scaleType="fitXY"
android:src="#drawable/accueil"
app:tint="#color/orange" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/redressed"
android:gravity="center"
android:text="#string/app_name"
android:textColor="#color/bleu"
android:textSize="30sp" />
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/list_recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="60dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Generer horaire"
android:layout_gravity="start"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Ajouter tache"
android:layout_gravity="end"
/>
</LinearLayout>
</LinearLayout>
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
My questions :
How can i align the layout as shown below
How can i recieve text in a textview with animation similar of marquee text (in place of Welcome Back,John Doe) which scrolls from right to left
Objective
but I am unable to align the icons here, and this is what i am getting:Screenshot_2
Concept :
These are icons and will display numbers in red circle whenever there's a notification or a message is recieved.
On the right side , I want to display text which depends the text recieved as message or text in the form of notification.Conside it dynamic, which keeps changing frequently.
I am stucked on this part and unable to solve it. I will be thankful if anyone can help me out with this !!
Thanks
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_landing_page"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="16dp"
android:paddingRight="16dp"
tools:context="com.thebitshoes.uocn.AdminHome"
android:orientation="vertical"
android:weightSum="2" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.66"
android:orientation="vertical"
android:weightSum="1">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#mipmap/admin_bg_pic"
android:layout_gravity="center_horizontal"
android:layout_weight="1.22" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="1"
android:background="#737D8C">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="40dp"
android:background="#3c424c"
android:layout_weight="0.31">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/message_icon_new"
android:id="#+id/message_icon"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="18dp"
android:layout_marginStart="18dp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/notification_icon"
android:id="#+id/notification_icon"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Welcome Back, John Doe !"
android:textColor="#ffffff"
android:textSize="18sp"
/>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1.34"
>
</LinearLayout>
</LinearLayout>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/activity_landing_page"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:weightSum="2">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.66"
android:orientation="vertical"
android:weightSum="1">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="1.22"
android:src="#mipmap/ic_launcher" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#737D8C"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="40"
android:background="#3c424c"
android:orientation="horizontal">
<ImageView
android:id="#+id/message_icon"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#drawable/add_event" />
<ImageView
android:id="#+id/notification_icon"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#drawable/add_notice" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="60"
android:background="#3c424c"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:padding="5dp"
android:text="Welcome Back, John Doe !"
android:textColor="#ffffff"
android:textSize="18sp" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1.34" />
</LinearLayout>
For marquee code you can look to the Marquee text in Android
and i don't sure but if you make your textview width match parent it should be okay but i am not 100% sure about it.
This is code
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="Email:"
android:textSize="30dp"
android:paddingLeft="0dp"
android:paddingTop="10dp"/>
<EditText
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:singleLine="true" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Login"
android:paddingTop="10dp"/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="200dp"
android:layout_height="100dp"
android:text="Home" />
<TextView
android:layout_width="200dp"
android:layout_height="200dp"
android:text="About" />
</LinearLayout>
</LinearLayout>
I want to practice a layout in android studio and I'm getting an error while implementing the code.
This is the text which goes outside the mobile screen:
Why does the blue box go outside the mobile screen?
You're not properly setting the layout. The childViews of your parentView(LinearLayout) was aligned horizontally without setting the layout weight. You should read the documentation on LinearLayout. However, to fix your layout, you can add another container to hold the first row of your layout to make the second row visible on the screen. Your current code contains all the childViews in a single row which makes the other views not visible. Try the code below:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="Email:"
android:textSize="30dp"
android:paddingLeft="0dp"
android:paddingTop="10dp"/>
<EditText
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:singleLine="true" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Login"
android:paddingTop="10dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="200dp"
android:layout_height="100dp"
android:text="Home" />
<TextView
android:layout_width="200dp"
android:layout_height="200dp"
android:text="About" />
</LinearLayout>
</LinearLayout>
You are setting the layout_width of each view yourself. You should know that there is a maximum width of screen that is available. Moreover, you are setting the width of button as match_parent that is not proper way when the neighbouring views have some fixed width. If your are using LinearLayout try layout_weight attribute. Play around and try to experiment.
For 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="horizontal">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:paddingLeft="0dp"
android:paddingTop="10dp"
android:text="Email:"
android:textSize="30dp" />
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_weight="2"
android:singleLine="true" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:paddingTop="10dp"
android:text="Login" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="100dp"
android:text="Home" />
<TextView
android:layout_width="wrap_content"
android:layout_height="200dp"
android:text="About" />
</LinearLayout>
</LinearLayout>