View not visible in device but visible in XML - android

I am trying to build a layout with a right arrow and a vertical line with 2 textviews to right of it.
This layout will be used in a RecyclerView
This is the code that I am using,
<?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="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:clickable="true"
android:id="#+id/rootLayout"
>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:layout_margin="#dimen/app_margin"
card_view:cardCornerRadius="4dp"
card_view:cardElevation="4dp"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="5dp"
>
<View
android:layout_width="20dp"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:id="#+id/lineView"
android:layout_marginLeft="15dp"
android:background="#color/colorPrimary"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/name"
android:layout_toRightOf="#+id/lineView"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/type"
android:layout_toRightOf="#+id/lineView"
android:layout_below="#+id/name"
/>
<android.support.v7.widget.AppCompatImageView
android:layout_width="50dp"
android:layout_height="50dp"
app:srcCompat="#drawable/right_arrow"
android:layout_alignParentEnd="true"
android:layout_centerInParent="true"
android:id="#+id/right_arrow"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
This is the result of the above layout
The blue line is not visible when I run the output on my device but is visible in XML as shown
My Questions
How do I make it visible in my device ?
The blue line is very big I tried wrap_content but still did not work


You can simply align your lineView upto the height of text views. otherwise it will grow upto the device height. Refer this sample.
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView 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="wrap_content"
android:layout_margin="10dp"
app:cardBackgroundColor="#FFFFFF"
app:contentPadding="10dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical">
<View
android:id="#+id/view"
android:layout_width="20dp"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/linearLayout"
android:layout_alignParentTop="true"
android:background="#color/colorPrimary" />
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toEndOf="#+id/view"
android:orientation="vertical"
android:padding="10dp">
<TextView
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="ABCD"
android:textSize="15sp" />
<TextView
android:id="#+id/value"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="ABCD"
android:textSize="15sp" />
</LinearLayout>
<ImageView
android:id="#+id/img"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
app:srcCompat="#drawable/ic_keyboard_arrow_right_black_24px" />
</RelativeLayout>
</android.support.v7.widget.CardView>
Screenshot of above example:


To fit the line according to content use this
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white">
<View
android:layout_width="20dp"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:id="#+id/lineView"
android:layout_marginLeft="15dp"
android:background="#color/colorPrimary"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/name"
android:layout_toRightOf="#+id/lineView"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/type"
android:layout_toRightOf="#+id/lineView"
android:layout_below="#+id/name"
/>
<LinearLayout />

Related

How can my RecyclerView leave space at the bottom for buttons

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>

Why adding the switch or checkbox button in Relative layout messes up the entire layout?

I want to add a switch or checkbox button to a fragment layout. When i add it, it loads the layout until the checkbox comes, and it kinda "destroy" the layout, mixing it with the previous layout fragment.
I tried using switch and checkbox and it messes up, using another textview instead it works fine.
Here is a photo with switch in xml: Image with switch
As you can see, the left margin is cutted and at his bottom there are elements from previous layout, and they are not clickable.
Here is a photo with a textview instead of the switch element: image without switch
Here, the layout works perfectly.
Here is the xml layout, with a not simple structure for creating the layout i wanted. At the bottom of the layout file, you can see the switch element, which i think it ruins the entire layout.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:app="http://schemas.android.com/tools"
android:background="#E8E8E8"
app:ignore="NamespaceTypo">
<!-- Here you put the rest of your current view-->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
>
<android.support.design.card.MaterialCardView
android:id="#+id/acquisto_cardview_info"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardElevation="2dp"
android:layout_margin="8dp"
card_view:cardCornerRadius="5dp"
card_view:strokeColor=" #696969"
card_view:strokeWidth="1dp"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="4dp">
<android.support.v7.widget.CardView
android:id="#+id/acquisto_cardview_info_intestazione"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
android:id="#+id/acquisto_cardview_info_intestazione_text1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/info_intestazione"
android:background="#drawable/textview_sottolineato"
style="#style/italictext_summary"
/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/acquisto_cardview_info_tot_articoli"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_below="#id/acquisto_cardview_info_intestazione"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/acquisto_cardview_info_tot_articoli_txt_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/info_totale_articoli"
style="#style/acquisto_card_textview"
android:layout_alignParentStart="true"
android:ellipsize="end"
/>
<TextView
android:id="#+id/acquisto_cardview_info_tot_articoli_txt_prezzo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
style="#style/acquisto_card_textview"
android:layout_alignParentEnd="true"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/acquisto_cardview_info_punti_guadagnati"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_below="#id/acquisto_cardview_info_tot_articoli"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/acquisto_cardview_info_punti_guadagnati_txt_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/info_punti_guagnati"
style="#style/acquisto_card_textview"
android:layout_alignParentStart="true"
android:ellipsize="end"
/>
<TextView
android:id="#+id/acquisto_cardview_info_punti_guadagnati_txt_prezzo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
style="#style/acquisto_card_textview"
android:layout_alignParentEnd="true"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
</android.support.design.card.MaterialCardView>
<android.support.design.card.MaterialCardView
android:id="#+id/acquisto_cardview_impo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardElevation="2dp"
android:layout_margin="8dp"
card_view:cardCornerRadius="5dp"
card_view:strokeColor=" #696969"
card_view:strokeWidth="1dp"
android:layout_below="#id/acquisto_cardview_info"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="4dp">
<android.support.v7.widget.CardView
android:id="#+id/acquisto_cardview_impo_intestazione"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
android:id="#+id/acquisto_cardview_impo_intestazione_text1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/impo_intestazione"
android:background="#drawable/textview_sottolineato"
style="#style/italictext_summary"
/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/acquisto_cardview_impo_carta_addebitata"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_below="#id/acquisto_cardview_impo_intestazione"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/acquisto_cardview_impo_carta_addebitata_txt_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/impo_carta_addebitata"
style="#style/acquisto_card_textview"
android:layout_alignParentStart="true"
android:ellipsize="end"
android:layout_toStartOf="#id/acquisto_cardview_impo_carta_addebitata_txt_prezzo"
/>
<TextView
android:id="#+id/acquisto_cardview_impo_carta_addebitata_txt_prezzo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Visa :x 5748"
style="#style/acquisto_card_textview"
android:layout_alignParentEnd="true"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/acquisto_cardview_impo_sconto_disponibile"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_below="#id/acquisto_cardview_impo_carta_addebitata"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/acquisto_cardview_impo_sconto_disponibile_txt_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/impo_sconto_disponibile"
style="#style/acquisto_card_textview"
android:layout_alignParentStart="true"
android:ellipsize="end"
/>
<TextView
android:id="#+id/acquisto_cardview_impo_sconto_disponibile_txt_prezzo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
style="#style/acquisto_card_textview"
android:layout_alignParentEnd="true"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/acquisto_cardview_impo_applica_sconto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_below="#id/acquisto_cardview_impo_sconto_disponibile"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!--inserire checkbox qui-->
<Switch
android:id="#+id/acquisto_cardview_impo_applica_sconto_switch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/impo_checkbox_sconto"
style="#style/acquisto_card_textview"
android:layout_alignParentStart="true"
android:ellipsize="end"
android:textOn="#string/on"
android:textOff="#string/off"
android:layoutDirection="rtl"
app:switchPadding="16dp"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
</android.support.design.card.MaterialCardView>
<android.support.design.card.MaterialCardView
android:id="#+id/acquisto_cardview_finale"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardElevation="2dp"
android:layout_margin="8dp"
card_view:cardCornerRadius="5dp"
card_view:strokeColor=" #696969"
card_view:strokeWidth="1dp"
android:layout_below="#id/acquisto_cardview_impo"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="4dp">
<android.support.v7.widget.CardView
android:id="#+id/acquisto_cardview_finale_intestazione"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
android:id="#+id/acquisto_cardview_finale_intestazione_text1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/finale_intestazione"
android:background="#drawable/textview_sottolineato"
style="#style/italictext_summary"
/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/acquisto_cardview_finale_totale_ordine"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_below="#id/acquisto_cardview_finale_intestazione"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/acquisto_cardview_finale_totale_ordine_txt_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/finale_totale_ordine"
style="#style/acquisto_card_textview"
android:layout_alignParentStart="true"
android:ellipsize="end"
android:layout_toStartOf="#id/acquisto_cardview_finale_totale_ordine_txt_prezzo"
/>
<TextView
android:id="#+id/acquisto_cardview_finale_totale_ordine_txt_prezzo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
style="#style/acquisto_card_textview"
android:layout_alignParentEnd="true"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/acquisto_cardview_finale_bottone_acquisto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_below="#id/acquisto_cardview_finale_totale_ordine"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TEST"
android:layout_centerHorizontal="true"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
</android.support.design.card.MaterialCardView>
</RelativeLayout>
</ScrollView>
Please help me, i dont know what's happening here.

Use ConstraintLayout root view group for your layout.
You will get at least 2 positive things:
You will remove "view to view" side effects.
You will have flatten layout with better performance.

overlapping a screen in android

In the below layout i have a text view named as scanning device.In that am displaying a device name But my device list was displaying above the screen .
can any one please help me how to scroll view should be inside the device list.while scrolling the screen it was displaying the list of the devices but it is displaying above the screen.
want to display inside a screen.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolBar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp"
android:text="#string/back"
android:textAllCaps="true"
android:textColor="#color/white"
android:visibility="invisible" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center"
android:padding="10dp"
android:textStyle="bold"
android:text="#string/lamp_list"
android:textAllCaps="true"
android:textColor="#color/white" />
<TextView
android:id="#+id/refresh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:drawableRight="#drawable/refresh"
android:gravity="right"
android:padding="10dp"
android:textAllCaps="true"
android:textColor="#color/white" />
<ProgressBar
android:id="#+id/scanningProgress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"
android:background="#drawable/baground"
android:orientation="vertical">
<TextView
android:id="#+id/scan_status"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="18dp"
android:gravity="center"
android:text="#string/start_discovery"
android:textColor="#color/white"
android:visibility="gone"
tools:visibility="visible" />
<android.support.v7.widget.RecyclerView
android:id="#+id/deviceListView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
In the below layout connect textview was coming out of the layout.
device_item.xml:
<?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:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:padding="10dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:padding="6dp"
android:src="#drawable/lamp" />
<TextView
android:id="#+id/deviceName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="left"
android:textColor="#color/white"
android:textSize="17sp"
tools:text="Solar Enviro SSL 2016" />
<TextView
android:id="#+id/connect"
android:layout_width="wrap_content"
android:layout_height="22dp"
android:background="#drawable/rounded_red_view"
android:text="#string/connect"
android:paddingBottom="1dp"
android:paddingTop=".2dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:textColor="#color/white"
android:textSize="17sp" />
</LinearLayout>

change this things..
used both wrap_content. i hope you also remove default action bar.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="?attr/actionBarSize"
android:orientation="vertical">
<TextView
android:id="#+id/scan_status"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="18dp"
android:gravity="center"
android:visibility="gone"
tools:visibility="visible" />
<android.support.v7.widget.RecyclerView
android:id="#+id/deviceListView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>

Instead of CoordinatorLayout use linear layout.
if u r a beginner start coding with linear layout. It is easy to understand.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

Android layout with fixed button on bottom

I have the following xml which is supposed to be something similar to the following
The activity shows mostly ok, but i cant get the two down buttons to get fixed to the bottom of the screen without messing the top views.
I've tried to use a FrameLayout with two RelativeLayouts, alignment_bottom, an empty view with weight 1 between components and even still havent being able to accomplish my goal. Any help will be really appreciated, thank you in advance.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<ScrollView android:layout_width="match_parent" android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/RelativeLayout1">
<ImageView
android:id="#+id/group_info_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitStart"
android:adjustViewBounds="true"
android:layout_alignParentTop="true"
/>
<TextView
android:id="#+id/description_text"
android:layout_below="#id/group_info_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/mainColor"
android:textSize="20sp"
android:text="#string/descripcion"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:fontFamily="sans-serif"
/>
<TextView
android:layout_below="#id/description_text"
android:gravity="start"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/group_info_description"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:layout_marginStart="10dp"
android:textSize="15sp"/>
<TextView
android:layout_below="#id/group_info_description"
android:scrollbars="vertical"
android:gravity="center"
android:textColor="#android:color/black"
android:layout_marginTop="10dp"
android:layout_marginStart="5dp"
android:layout_marginBottom="2dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/group_info_user_number"
android:textSize="15sp"
/>
<es.tretornesp.clickerchat.NonScrollableListView
android:layout_below="#id/group_info_user_number"
android:id="#+id/group_info_user_list"
android:layout_height="match_parent"
android:divider="#drawable/list_divider"
android:dividerHeight="1px"
android:layout_width="match_parent"/>
</RelativeLayout>
</ScrollView>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/delete_group"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/borrar_grupo"
android:background="#color/mainColor" />
<View
android:id="#+id/divisor"
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/grey"/>
<Button
android:id="#+id/exit_group"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/white"
android:text="#string/salir"
android:background="#color/mainColor"
/>
</LinearLayout>
</LinearLayout>

Change your layout file as below,
<?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">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/exit_group">
<RelativeLayout
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/group_info_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:adjustViewBounds="true"
android:scaleType="fitStart" />
<TextView
android:id="#+id/description_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/group_info_image"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:fontFamily="sans-serif"
android:text="#string/descripcion"
android:textColor="#color/mainColor"
android:textSize="20sp" />
<TextView
android:id="#+id/group_info_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/description_text"
android:layout_marginBottom="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="5dp"
android:gravity="start"
android:textSize="15sp" />
<TextView
android:id="#+id/group_info_user_number"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/group_info_description"
android:layout_marginBottom="2dp"
android:layout_marginStart="5dp"
android:layout_marginTop="10dp"
android:gravity="center"
android:scrollbars="vertical"
android:textColor="#android:color/black"
android:textSize="15sp" />
<es.tretornesp.clickerchat.NonScrollableListView
android:id="#+id/group_info_user_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/group_info_user_number"
android:divider="#drawable/list_divider"
android:dividerHeight="1px" />
<Button
android:id="#+id/delete_group"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/group_info_user_list"
android:background="#color/mainColor"
android:text="#string/borrar_grupo" />
<View
android:id="#+id/divisor"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#id/delete_group"
android:background="#color/grey" />
</RelativeLayout>
</ScrollView>
<Button
android:id="#+id/exit_group"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#color/mainColor"
android:text="#string/salir"
android:textColor="#android:color/white" />
</RelativeLayout>

Use Coordinator Layout as a parent layout. like this.
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:card_view="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="false">
// your code
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="horizontal">
<TextView
android:id="#+id/txt_contact_laksha_group"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="demo"
/>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>

Custom row with circular ImageView and textview in android

I am trying to create a custom row for my RecyclerView. Here is my custom row 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="180dp"
android:layout_margin="5dp"
android:background="#00000000">
<FrameLayout
android:id="#+id/customLevelLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/levelImage"
android:layout_width="160dp"
android:layout_height="160dp"
android:layout_above="#+id/gameText"
android:layout_centerInParent="true"
android:scaleType="fitXY"
android:src="#drawable/circular_background" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="1"
android:textColor="#fff"
android:textSize="45sp" />
<TextView
android:id="#+id/gameText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:gravity="center"
android:textColor="#000"
tools:text="Tracing" />
</RelativeLayout>
<ProgressBar
android:id="#+id/gameProgressBar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff"
android:indeterminate="true"
android:padding="45dp"
android:visibility="gone" />
</FrameLayout>
<ImageView
android:id="#+id/lockImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/lock_background"
android:padding="45dp"
android:src="#drawable/lock"
android:visibility="gone" />
</RelativeLayout>
This is how it looks like:
The problem is, I have to define a predefined height of the custom row i.e 170dp currently. I am facing 2 problems because of this:
1) If I open the application in a small screen or a tablet device. The custom row is looking ugly i.e I loose the circular shape of the ImageView.
2) The text doesn't remain at the centre if there is a slight change in the layout.

Try this in your code .
<?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="wrap_content"
android:layout_margin="5dp"
android:background="#00000000">
<FrameLayout
android:id="#+id/customLevelLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/levelImage"
android:layout_width="160dp"
android:layout_height="160dp"
android:layout_centerInParent="true"
android:scaleType="fitXY"
android:src="#drawable/circular_background" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center"
android:text="1"
android:textColor="#fff"
android:textSize="45sp"/>
</RelativeLayout>
<TextView
android:id="#+id/gameText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:gravity="center"
android:textColor="#000"
tools:text="Tracing"/>
</LinearLayout>
<ProgressBar
android:id="#+id/gameProgressBar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff"
android:indeterminate="true"
android:padding="45dp"
android:visibility="gone"/>
</FrameLayout>
<ImageView
android:id="#+id/lockImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/lock_background"
android:padding="45dp"
android:src="#drawable/lock"
android:visibility="gone" />
</RelativeLayout>

Try This. You can use Linearlayout as root than for image and text use RelativeLayout
<?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:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#00000000"
android:orientation="vertical">
<FrameLayout
android:id="#+id/customLevelLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/levelImage"
android:layout_width="160dp"
android:layout_height="160dp"
android:layout_centerInParent="true"
android:scaleType="fitXY"
android:src="#drawable/circular_background" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="1"
android:textColor="#fff"
android:textSize="45sp" />
</RelativeLayout>
<TextView
android:id="#+id/gameText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_margin="10dp"
android:gravity="center"
android:textColor="#000"
tools:text="Tracing" />
</LinearLayout>
<ProgressBar
android:id="#+id/gameProgressBar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff"
android:indeterminate="true"
android:padding="45dp"
android:visibility="gone" />
</FrameLayout>
<ImageView
android:id="#+id/lockImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/lock_background"
android:padding="45dp"
android:src="#drawable/lock"
android:visibility="gone" />
</LinearLayout>

Use constrain layout which helps you to set image like you want just by drag and drop and add constrain

For supporting multiple screen. First you have to go through this link
enter link description here
Once you fix first issue, second issue also will get fix

Categories

Resources