Bottom nav bar android studio - java

<FrameLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#+id/bottomnav">
</FrameLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomnav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
Whenever i try to add bottom navigation bar the whole activity goes blank

If you would like to display buttons in the Bottom Navigation Bar, you need to add app:menu to BottomNavigationView:
<?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"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<FrameLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#+id/bottomnav">
</FrameLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomnav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:menu="#menu/bottom_nav_menu"/>
</androidx.constraintlayout.widget.ConstraintLayout>
Under res/menu, create a bottom_nav_menu.xml:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#+id/main" android:title="Main" />
<item android:id="#+id/secondary" android:title="Secondary" />
</menu>
Then you should see 2 buttons in your Bottom Navigation Bar.
The above should work fine on a Physical Android Device. If you are not able to preview the Bottom Navigation Bar in Design view of Android Studio, please check if your build.gradle has the following dependency:
implementation 'com.google.android.material:material:1.5.0'
You can either downgrade it to:
implementation 'com.google.android.material:material:1.3.0'
or upgrade it to:
implementation 'com.google.android.material:material:1.6.0'

Related

migrate LinearLayout to Cardview selectable

My recyclerview is:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:layout_width="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#drawable/recyclerview_highlight"
android:layout_margin="6dp">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="6dp">
<TextView
android:id="#+id/articleCategTextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxLines="1"
android:text="#null"
app:layout_constraintBottom_toTopOf="#id/articleNameTextView"
app:layout_constraintRight_toLeftOf="#id/articleQteTextView"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/articleQteTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toRightOf="#id/articleCategTextView"
app:layout_constraintBottom_toTopOf="#id/articleNameTextView"
android:text="#null" />
<TextView
android:id="#+id/articleNameTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxLines="1"
app:layout_constraintBottom_toBottomOf="parent"
android:text="#null" />
</androidx.constraintlayout.widget.ConstraintLayout>
</LinearLayout>
#drawable/recyclerview_highlight:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="#color/selected_color"/>
</selector>
In "onBindViewHolder", I highlight it, when selected with:
holder.itemView.setSelected(article.isSelected());
All is ok BUT, for a little more visual elegance, I wanted to transform the LinearLayout into Cardview.
And when I try it, setSelected has not effect anymore. I even try to "setActivated" with state_activated but not better.
What should I modify to obtain the same type of operation? Is it at the level of the layout, the selector or the java code, and what to use instead of "selected"?
I finaly had to add a LinearLayout, inside the cardView; which is the one I setSelected() and the result is what I needed.

Change Shape of constraintlayout in Android

Im trying to change shape of root constraintlayout in my fragment.
like below image, to place my close button on right top corner. Is it possible in android?
constraintlayout shape image
Yes it is possible, just have a white background of the parent constraintlayout. Here's the working code which produces exact same output as of your image:
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:paddingLeft="10dp"
android:paddingTop="10dp"
android:paddingRight="10dp"
android:paddingBottom="10dp">
<RelativeLayout
android:id="#+id/cross"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#ff0000"
android:padding="10dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:src="#drawable/ic_baseline_clear_24" />
</RelativeLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/dostuff"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#ff0000"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/cross">
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Adding Image in landscape mode of the above layout:

How to keep the floatingActionButton fixed at is original position when scrolling the recyclerview

I need help to keep the fab shown in pics at a fixed position when scrolling up or down i cant find anything on google as most search results return information on hiding the fab when scrolling
Here is my xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/accent"> <android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/accent"
>
<android.support.v7.widget.RecyclerView
android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:dividerHeight="1dp"
/>
</android.support.constraint.ConstraintLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/addmorefab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginBottom="#dimen/fab_marginBottom"
android:layout_marginRight="#dimen/fab_marginRight"
android:clickable="true"
app:backgroundTint="#color/primary"
app:srcCompat="#drawable/ic_action_new"
app:layout_anchor="#id/listView"
app:layout_anchorGravity="bottom|right|end"
/></android.support.constraint.ConstraintLayout>
I even tried to make two constraint layouts it didnt work
I also tried using recyclerView.setNestedScrollingEnabled(false);
It worked but it was limiting the scrolling of the recyclerview.
On the second picture i want the fab to remain fixed where it is not scrolling
You can use this view if you want your bright button to remain fixed while scrolling through the recycler.
I used Android X libraries and you can use lower version libraries.
<?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">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:dividerHeight="1dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/addmorefab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="18dp"
android:layout_marginBottom="18dp"
android:clickable="true"
app:backgroundTint="#color/colorPrimary"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:srcCompat="#android:drawable/ic_input_add" />
</androidx.constraintlayout.widget.ConstraintLayout>

Any reason why the distance between buttons do not match in design view and on device at Android Studio?

Here is the code I am using at the layout file. I am using Material components as theme style. Here I used both material component button and button, but I think they are both converted to material button due to my theming style:
<?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=".MainActivity">
<Button
android:id="#+id/createAccountBtn"
android:layout_width="238dp"
android:layout_height="wrap_content"
android:layout_marginStart="86dp"
android:layout_marginTop="35dp"
android:layout_marginEnd="87dp"
android:layout_marginBottom="318dp"
android:text="#string/create_account"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/signInBtn" />
<Button
android:id="#+id/signInBtn"
android:layout_width="237dp"
android:layout_height="wrap_content"
android:layout_marginStart="89dp"
android:layout_marginTop="282dp"
android:layout_marginEnd="85dp"
android:layout_marginBottom="14dp"
android:text="#string/common_signin_button_text"
app:layout_constraintBottom_toTopOf="#+id/createAccountBtn"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
The emmulator model and the model for which you designed the app might be different !
Please check that and revert back .
Apparently I need to use match_parent and wrap_content properties for layout_width and layout_height. One can see this documentation for its use with ConstraintLayout here: https://developer.android.com/training/multiscreen/screensizes
But I would suggest using LinearLayout as ConstraintLayout in my case behaved still badly because I had to define margin properties in exact dps which may not align with a certain screen size. I am adding the LinearLayout solution below which worked as I expected in portrait and landscape mode as well:
<?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:gravity="center"
android:orientation="vertical"
android:padding="16dp"
tools:context=".MainActivity">
<Button
android:id="#+id/createAccountBtn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/create_account" />
<Button
android:id="#+id/signInBtn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/common_signin_button_text"/>
</LinearLayout>

Apply elevation to TextInputLayout

I'm trying to create a searchbar with similar styling to the Toolbar in the Google Photos app - that is, rounded with a drop shadow.
We're using a TextInputLayout from the Material library as the sole child of a fragment (which gets inflated at the top of parent fragments).
Below is what I have at the moment (I have a drawable available to use as the background once I can get the elevation to shop up, I've omitted that for clarity)
<?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=".Fragments.SearchFragment">
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/searchTextInputLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/searchTextInputEditText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:paddingStart="24dp"
android:paddingEnd="24dp"
android:background="#ffffff"
android:elevation="20dp"
android:drawableStart="#drawable/ic_menu_black_24dp"
android:hint="Search" />
</com.google.android.material.textfield.TextInputLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<!--android:background="#drawable/searchbar_rounded"-->
Am I missing something obvious here, or is this a limitation of the TextInputLayout?
Put textView inside cardView and it will make shadow for sure
Example of the cardView
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="6dp"
card_view:cardUseCompatPadding="true"
card_view:cardElevation="4dp"
card_view:cardCornerRadius="3dp">

Categories

Resources