Search code examples
androidandroid-recyclerviewandroid-relativelayout

Button getting out of the screen android layout


I got this relativelayout and on the design screen of android studio looks good

enter image description here

<?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"
    android:padding="8dp"
    tools:context="com.checking.movi.movioperations.CartItems">


    <TextView
        android:id="@+id/txtcartprod"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Productos seleccionados:"
        />

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recycler_cart"
        android:layout_width="match_parent"
        android:layout_height="649dp"
        android:layout_below="@+id/txtcartprod"
        />

    <Button
        android:id="@+id/btn_placeorder"
        style="?android:attr/buttonStyleSmall"
        android:layout_below="@+id/recycler_cart"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/mybutton"
        android:text="Continuar"
        android:textColor="#ffffff" />

</RelativeLayout>

But when I test on the phone the button gets out of the screen if I decrease the size of the recyclerview it does appear can you guys give me a little help with this don't know to tell it to keep the 3 on the same screen


Solution

  • Giving width and height to views in dp's (or pixels) isn't the correct way. Because screen size isn't the same in all devices. Your design tab at Android Studio shows your layout in Pixel phone whose height is greater than your mobile phones. So, you can't see that button in your mobile phone.

    I have added one line to your button and deleted another

    Added this:

    android:layout_alignParentBottom="true"
    

    Deleted this:

    android:layout_below="@+id/txtcartprod"
    

    Changed height of RecyclerView to match_parent (to make it depend on screen size):

    android:layout_height="match_parent"
    

    And added this line:

    android:layout_above= "@id/btn_placeorder"
    

    Final version:

    <?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"
        android:padding="8dp"
        tools:context="com.checking.movi.movioperations.CartItems">
    
    
        <TextView
            android:id="@+id/txtcartprod"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Productos seleccionados:"
            />
    
        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recycler_cart"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_above= "@id/btn_placeorder"
            android:layout_below="@+id/txtcartprod"
            />
    
        <Button
            android:id="@+id/btn_placeorder"
            style="?android:attr/buttonStyleSmall"
            android:layout_alignParentBottom="true"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/mybutton"
            android:text="Continuar"
            android:textColor="#ffffff" />
    
    </RelativeLayout>
    

    I hope you understood all the changes I made. If you have difficulty, feel free to ask in the comments.