Adding buttons to a XML file containing a ListView - java

I've been trying to implement three buttons in an XML file that contains a ListView. However, these buttons are being added to the individual views as they are added to the collection. Does anyone know how to separate these so that the buttons are separate from the ListView?
Thanks in advance!
Code for button XML
<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">
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="85dp"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<Button
android:id="#+id/ClearAll"
android:layout_width="wrap_content"
android:layout_height="100dp"
android:onClick="onClickClearAll"
android:text="Clear All Checks"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/checkAll"
app:layout_constraintHorizontal_chainStyle="spread_inside"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/checkAll"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:onClick="onClickCheckAll"
android:text="Check All Devices"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#+id/ClearAll"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
ListView Code
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/device_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="24sp" />
<TextView
android:id="#+id/device_address"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="12sp" />
<ListView
android:id="#+id/lvCheckBox"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:cacheColorHint="#null"
android:fadingEdge="none">
</ListView>
<CheckBox
android:id="#+id/CheckBox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp" />
</LinearLayout>
Combined XML
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:id="#+id/ClearAll"
android:layout_width="match_parent"
android:layout_height="70dp"
android:layout_above="#id/checkAll"
android:onClick="onClickClearAll"
android:text="Uncheck All" />
<Button
android:id="#+id/checkAll"
android:layout_width="match_parent"
android:layout_height="70dp"
android:onClick="onClickCheckAll"
android:text="Check All"/>
<Button
android:id="#+id/passCredentials"
android:layout_width="match_parent"
android:layout_height="70dp"
android:onClick="onClickPassCredentials"
android:text="Enter Credentials" />
<TextView
android:id="#+id/device_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="24sp" />
<TextView
android:id="#+id/device_address"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="12sp" />
<ListView
android:id="#+id/lvCheckBox"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_above="#id/ClearAll"
android:layout_alignParentTop="true"
android:layout_weight="1.0"
android:cacheColorHint="#null"
android:fadingEdge="none">
</ListView>
<CheckBox
android:id="#+id/CheckBox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp" />
</LinearLayout>

Related

button below a layout still clickable

I have a screen with vertical button. nothing fancy but it does the job. One of the button is sign-out. during the sign-out process, I want to display a progress circle... this working but the buttons underneath are still clickable and I do not want to. None of the buttons should be clickable when the loading screen appear.
<?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="#drawable/teal_background"
android:paddingLeft="16dp"
android:paddingTop="16dp"
android:paddingRight="16dp"
android:paddingBottom="16dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="-16dp"
android:paddingRight="-16dp">
<ImageButton
android:id="#+id/back_button"
android:layout_width="52dp"
android:layout_height="52dp"
android:layout_weight="1"
android:adjustViewBounds="true"
android:background="#android:color/transparent"
android:padding="12dp"
android:scaleType="fitCenter"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/back" />
<LinearLayout
android:id="#+id/top_nav"
android:layout_width="match_parent"
android:layout_height="52dp"
android:gravity="center_vertical"
android:orientation="horizontal"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Settings"
android:textAlignment="center"
android:textColor="#android:color/white"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
...
<Button
android:id="#+id/firebase_cloud_messaging_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/transparent_bg_bordered_button"
android:text="Firebase Cloud Messaging"/>
<Button
android:id="#+id/vehicle_signals_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/transparent_bg_bordered_button"
android:text="Vehicle Signals"/>
<Button
android:id="#+id/notifications_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/transparent_bg_bordered_button"
android:text="Notifications"/>
<Button
android:id="#+id/sign_out_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/transparent_bg_bordered_button"
android:text="Sign out"/>
</androidx.appcompat.widget.LinearLayoutCompat>
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorAccent"
android:visibility="visible"
android:clickable="false">
<ProgressBar
android:id="#+id/progressBar"
style="?android:attr/progressBarStyle"
android:layout_gravity="center"
android:layout_width="36dp"
android:layout_height="36dp" />
</androidx.appcompat.widget.LinearLayoutCompat>
Any idea on how to make sure there is no clicks button when loading is visibile>
Thankgs
Update you code in xml add attribute clickable = true.
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorAccent"
android:visibility="visible"
android:clickable="true">
<ProgressBar
android:id="#+id/progressBar"
style="?android:attr/progressBarStyle"
android:layout_gravity="center"
android:layout_width="36dp"
android:layout_height="36dp" />
</androidx.appcompat.widget.LinearLayoutCompat>

I'm making a mistake somewhere while making a simple design

no matter what I do in my design, I want to center what I wrote with the photographs, but I cannot do the design, I wonder where I am going wrong I'm learning new and tried to make a design like in the photo
I'll create the rest using the recycler view and card view
Enough explanation, I hope I don't want to confuse you
<androidx.cardview.widget.CardView 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">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView6"
android:layout_width="60dp"
android:layout_height="60dp"
android:contentDescription="TODO" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/textView4"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="text" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/textView5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Date" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal">
<TextView
android:id="#+id/textView3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="text" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView7"
android:layout_width="60dp"
android:layout_height="60dp"" />
</LinearLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
Splitted the center part to two linear layouts. Also added android:gravity="center|bottom" to the TextView which contains the date.
<androidx.cardview.widget.CardView 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">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView6"
android:layout_width="60dp"
android:layout_height="60dp"
android:contentDescription="TODO" />
<LinearLayout
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:orientation="horizontal">
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="text" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="text" />
</LinearLayout>
<TextView
android:id="#+id/textView5"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center|bottom"
android:text="Date" />
</LinearLayout>
<ImageView
android:id="#+id/imageView7"
android:layout_width="60dp"
android:layout_height="60dp" />
</LinearLayout> </androidx.cardview.widget.CardView>
Here's how it looks like. I added some colors so it's easier to see where layouts begin and end. The colors are not part of the xml.

Inflating another layout with drawer layout

Greetings my fellow programmers,
I've got an easy one i'd guess but i still don't know why it causes such behaviour.
So the scene is this: i've got appliaction which plays music via service and the mini player at the bottom which i've added in a way that i inflated main layout.
If i do not inflate layout with the mini player i can use method's (menu items) inside drawer normally (it takes me to wanted destination and triggers sliding operations flawlessly) once i start playing music i infalte the layout so i show the player and i can do this with drawer :
I can open it from sliding and from hamburger button
I can open it from sliding and from hamburger button
I CAN'T CLOSE it by right-left slide
METHODS DO NOT work inside drawer
Any ideas why inflating messes it up?
P.S
On the main layout i use Coordinator Layout at parent view so i can use floating buttons
***** EDIT: HERE ARE SCREENS ******
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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/cili_test"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.example.android.listenyo_41.MainActivity"
android:background="#color/white">
<!-- Loading indicator is only shown before the first load -->
<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"
tools:context="com.example.android.listenyo_41.MainActivity"
android:id="#+id/cili_test2"
android:background="#color/black"
>
<!-- Loading indicator is only shown before the first load -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/nesto_glupo"
android:orientation="vertical"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/black">
<ImageButton
/>
<android.support.v7.widget.Toolbar
/>
<com.miguelcatalan.materialsearchview.MaterialSearchView
/>
</RelativeLayout>
<ListView
/>
<RelativeLayout
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:orientation="vertical"
android:background="#color/black"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="5dp"
android:id="#+id/test_fade"
>
<Button
/>
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/activity_main_swipe_refresh_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ListView
/>
</android.support.v4.widget.SwipeRefreshLayout>
<!-- Empty view is only visible when the list has no items. -->
</LinearLayout>
</RelativeLayout>
</LinearLayout>
<TextView
/>
<ProgressBar
/>
</RelativeLayout>
<!-- Container for contents of drawer - use NavigationView to make configuration easier -->
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:menu="#menu/drawer_view"
app:headerLayout="#layout/nav_header"
app:itemIconTint="#color/white"
android:background="#color/black"
app:itemTextColor="#color/white"
/>
</android.support.v4.widget.DrawerLayout>
<ProgressBar
android:id="#+id/picasso_progress"
style="#android:style/Widget.Holo.Light.ProgressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center"
android:visibility="gone" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#75d9534f"
android:id="#+id/crvena_traka"
>
<RelativeLayout
android:id="#+id/songName_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone">
<SeekBar
android:id="#+id/seekBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="135dp"
android:layout_marginTop="5dp"
android:paddingEnd="6dp"
android:paddingLeft="6dp"
android:paddingRight="6dp"
android:paddingStart="6dp"
android:progressDrawable="#drawable/progress_drawable"
android:thumbTint="#color/black"
android:visibility="gone"
/>
<TextView
android:id="#+id/songDuration"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#id/seekBar"
android:layout_gravity="center"
android:layout_marginBottom="5dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="140dp"
android:layout_marginTop="2dp"
android:text="00:00:00"
android:textColor="#color/white"
android:textStyle="bold"
android:visibility="gone"
/>
<com.example.android.listenyo_41.ScrollTextView
android:id="#+id/songName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#id/seekBar"
android:layout_marginBottom="5dp"
android:layout_marginLeft="15dp"
android:layout_marginTop="2dp"
android:layout_toLeftOf="#id/songDuration"
android:textColor="#color/white"
android:textSize="14sp"
android:textStyle="bold"
android:visibility="gone"
/>
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
<TextView
android:id="#+id/btn_lay_textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="7dp"
android:text="Buffering"
android:textAlignment="center"
android:textColor="#color/gray"
android:textSize="16sp"
android:textStyle="bold"
android:visibility="gone"
android:layout_marginRight="5dp"
android:layout_marginLeft="5dp"
/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="#id/player_controler"
android:layout_weight="2">
<ProgressBar
android:id="#+id/loading_indicator2"
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="100dp"
android:indeterminateDrawable="#drawable/my_border4"
android:visibility="gone" />
<RelativeLayout
android:id="#+id/player_controler2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="5dp"
android:background="#color/black"
android:visibility="visible">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:layout_marginTop="20dp"
android:orientation="vertical"
>
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/activity_main_swipe_refresh_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/black">
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/black"
android:choiceMode="singleChoice"
android:divider="#null"
android:dividerHeight="5dp"
android:orientation="horizontal"
/>
</android.support.v4.widget.SwipeRefreshLayout>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
</LinearLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/activity_main_swipe_refresh_layout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="100dp"
android:visibility="gone">
<TextView
android:id="#+id/empty_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
android:gravity="center"
android:textAppearance="?android:textAppearanceMedium"
/>
</android.support.v4.widget.SwipeRefreshLayout>
</FrameLayout>
<!-- Container for contents of drawer - use NavigationView to make configuration easier -->
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:menu="#menu/drawer_view"
app:headerLayout="#layout/nav_header"
app:itemIconTint="#color/white"
android:background="#color/black"
app:itemTextColor="#color/white"
/>
</android.support.v4.widget.DrawerLayout>
</android.support.design.widget.CoordinatorLayout>
And the mini player
<?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"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:id="#+id/play_test"
android:visibility="visible"
>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_alignParentBottom="true"
android:background="#color/myColor"
android:elevation="10dp"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:layout_marginBottom="5dp"
android:id="#+id/play_lay"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="60dp"
android:orientation="horizontal"
android:background="#drawable/bl_tran_grad"
>
<RelativeLayout
android:id="#+id/icon_layout"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:layout_weight="1"
android:onClick="player"
>
<ProgressBar
style="#android:style/Widget.Holo.Light.ProgressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_centerInParent="true"
android:visibility="gone"
android:id="#+id/picasso_progress2"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
android:layout_gravity="center"
android:id="#+id/error2"
android:text="Error loading picture"
android:textColor="#color/black"
android:textSize="13sp"
android:textStyle="bold"
android:textAlignment="center"
android:layout_centerInParent="true"
/>
<ImageView
android:id="#+id/player_img"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_centerInParent="true"
android:scaleType="centerCrop"
>
</ImageView>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:layout_margin="5dp"
android:onClick="player"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="2"
android:id="#+id/songName2"
android:textSize="14sp"
android:layout_centerVertical="true"
android:textColor="#color/white"
android:textStyle="bold"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:onClick="player_2_pause"
>
<ImageView
android:layout_width="50dp"
android:layout_height="35dp"
android:layout_centerInParent="true"
android:src="#drawable/ic_launcher"
android:onClick="player_2_resume"
android:visibility="invisible"
android:id="#+id/player_2_resume"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Buffering"
android:textColor="#color/white"
android:layout_centerInParent="true"
android:textSize="14sp"
android:visibility="visible"
android:id="#+id/buffering"
/>
<ImageView
android:layout_width="50dp"
android:layout_height="35dp"
android:src="#drawable/pause2"
android:onClick="player_2_pause"
android:visibility="invisible"
android:id="#+id/player_2_pause"
android:layout_centerInParent="true"
/>
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
<SeekBar
android:padding="0dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:id="#+id/seekBar_player2"
android:layout_width="match_parent"
android:layout_height="4.0dp"
android:layout_above="#id/play_lay"
android:background="#80000000"
android:maxHeight="5dp"
android:minHeight="4dp"
android:progressDrawable="#drawable/progress_drawable"
android:max="10"
android:thumb="#color/white"
android:paddingStart="0dp"
android:paddingEnd="0dp"
android:paddingLeft="0dp"
android:paddingRight="0dp" />
</RelativeLayout>
When player active[1]
without player drawer[2]
both[3]
[1]: https://i.stack.imgur.com/gD0BY.jpg
[2]: https://i.stack.imgur.com/0zcYP.jpg
[3]: https://i.stack.imgur.com/qFY6q.jpg

How to prevent overlapping of buttons and other objects?

When i preview with android emulator, the layout preview is ok. But when I install the app in my mobile the views overlaps. It may be because of lack of space in the mobile screen but I have no idea. Please help me out. And also help me with making this app to work with all screen sizes. Thanks in advance.
First image is emulator preview 2nd is mobile preview
Here is the xml 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="match_parent"
android:paddingBottom="16dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="16dp"
android:orientation="vertical"
android:background="#drawable/newbackground"
tools:context=".MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="300dp">
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="40dp"
app:srcCompat="#drawable/dicee_logo" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/dicee_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
app:srcCompat="#drawable/dice1" />
<ImageView
android:id="#+id/dicee_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
app:srcCompat="#drawable/dice2" />
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<Button
android:id="#+id/roll_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="61dp"
android:background="#color/colorPrimary"
android:text="#string/button_text"
android:textColor="#android:color/white" />
<Button
android:id="#+id/next_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignEnd="#+id/roll_button"
android:layout_alignParentBottom="true"
android:layout_alignRight="#+id/roll_button"
android:layout_marginBottom="25dp"
android:background="#android:color/holo_blue_light"
android:text="Next page" />
</RelativeLayout>
</LinearLayout>
This will keep the 2 textview to bottom and will expand in whatever view you use
<?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:gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scaleType="centerInside"
android:src="#drawable/ic_word" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/dicee_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
app:srcCompat="#drawable/ic_word" />
<ImageView
android:id="#+id/dicee_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
app:srcCompat="#drawable/ic_pdf" />
</LinearLayout>
<Button
android:id="#+id/roll_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:background="#color/colorPrimary"
android:text="text"
android:textColor="#android:color/white" />
<Button
android:id="#+id/next_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="30dp"
android:background="#android:color/holo_blue_light"
android:text="Next page" />
</LinearLayout>
Try the below modified code. Since you want the buttons below each other. You cannot place one on right of other, so remove the alignRight.
<Button
android:id="#+id/roll_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
**android:layout_marginTop="21dp"**
android:background="#color/colorPrimary"
android:text="#string/button_text"
android:textColor="#android:color/white" />
<Button
android:id="#+id/next_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignEnd="#+id/roll_button"
android:layout_alignParentBottom="true"
**android:layout_alignRight="#+id/roll_button"**
android:layout_marginBottom="25dp"
android:background="#android:color/holo_blue_light"
android:text="Next page" />

Android layout inconsistency

I have a layout that is being displayed in two different layouts. First one is being displayed in a LinearLayout and it behaves as expected:
However, when this layout is part of a listview, the textview is not centered:
Here's the layout:
<?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="130dp"
android:orientation="vertical">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="horizontal"
android:padding="5dp">
<com.parse.ParseImageView
android:id="#+id/iv"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:scaleType="fitCenter"/>
<TextView
android:id="#+id/tv_title"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2.5"
android:layout_marginLeft="10dp"
android:textAppearance="#android:style/TextAppearance.Holo.Medium"
android:ellipsize="end"
android:maxLines="3"
android:textStyle="bold"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="25dp"
android:orientation="horizontal"
android:paddingLeft="10dp">
<View
android:layout_width="20dp"
android:layout_height="20dp"
android:background="#color/blue"
android:layout_gravity="center"
/>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#color/gray"
android:layout_margin="7dp"
/>
<TextView
android:id="#+id/tv_source"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:textAppearance="#android:style/TextAppearance.Holo.Small"
android:gravity="center"/>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#color/gray"
android:layout_margin="7dp"
/>
<TextView
android:id="#+id/tv_date"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:fontFamily="sans-serif-light"
android:textAppearance="#android:style/TextAppearance.Small"
android:gravity="center"/>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#color/gray"
android:layout_margin="7dp"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_fire"
android:layout_gravity="center"/>
<TextView
android:id="#+id/tv_viewCount"
android:layout_marginLeft="5dp"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:fontFamily="sans-serif-light"
android:textAppearance="#android:style/TextAppearance.Small"
android:gravity="center"/>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="5dp"/>
</LinearLayout>
<ImageView
android:id="#+id/pin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_pin"/>
<TextView
android:id="#+id/comment_tv"
android:layout_width="0dp"
android:layout_height="0dp"
android:textColor="#color/white"
android:layout_alignTop="#+id/pin"
android:layout_alignBottom="#+id/pin"
android:layout_alignLeft="#id/pin"
android:layout_alignRight="#+id/pin"
android:gravity="center"
android:layout_marginBottom="10dp"/>
</RelativeLayout>
The textView that I am referring to is at the bottom with id comment_tv
What am I doing wrong?
Thanks
Your pin+text inside a relative layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_gravity="center_vertical" >
<ImageView
android:id="#+id/pin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_pin"/>
<TextView
android:id="#+id/comment_tv"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_alignTop="#id/pin"
android:gravity="center"
android:layout_marginTop="10dp" //set this higher if you need
android:layout_centerHorizontal="true" //if this text will be not in the center
//you can use the "layout_marginLeft" to put whatever you want
/>
</RelativeLayout>
This should but the text on the spot you want
I tried it with your image and this is my result with underlying code. Is this what you are looking for?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/sample"
android:gravity="center"
android:text="12"
android:textSize="18sp" />
</LinearLayout>
And heres a snapshot of this code:

Categories