Android - How to add Notification Counter on the right above of ImageView

Android - How to add Notification Counter on the right above of ImageView - java

I want to have an app with similar notification counter on the right side of the Imageview: here is the photo of my layout:
I want to have such Notification Counter:
Here is my activity_menu 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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="datasite.com.konnex.Menu"
android:background="#ffffff">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#3fc0ea">
<ImageButton
android:layout_width="120dp"
android:layout_height="38dp"
android:background="#drawable/lg1"
android:layout_marginLeft="130dp" />
<SearchView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="90dp"/>
</android.support.v7.widget.Toolbar>
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="2">
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:src="#drawable/cases"
android:layout_marginLeft="60dp"
android:layout_marginTop="40dp"
android:id="#+id/img_cases"/>
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:src="#drawable/invoices"
android:layout_marginLeft="80dp"
android:layout_marginTop="40dp" />
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:src="#drawable/announcement"
android:layout_marginLeft="60dp"
android:layout_marginTop="40dp" />
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:src="#drawable/users"
android:layout_marginTop="40dp"
android:layout_marginLeft="80dp"/>
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:src="#drawable/document"
android:layout_marginTop="60dp"
android:layout_marginLeft="60dp" />
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:src="#drawable/meetings"
android:layout_marginTop="60dp"
android:layout_marginLeft="80dp"/>
</GridLayout>
</FrameLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fffafa"
app:menu="#menu/navigation"
app:itemIconTint="#color/dark"
app:itemTextColor="#color/dark" />
</LinearLayout>
Here is my menu.java class:
public class Menu extends AppCompatActivity {
private BottomNavigationView.OnNavigationItemSelectedListener mOnNavigationItemSelectedListener
= new
BottomNavigationView.OnNavigationItemSelectedListener() {
#Override
public boolean onNavigationItemSelected(#NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.nav_about:
return true;
case R.id.nav_location:
return true;
case R.id.nav_phone:
return true;
case R.id.nav_home:
return true;
}
return false;
}
};
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_menu);
}
}
Please help to find solution to this problem. I have searched many answers but haven't found the solution specific to my case. Thanks in advance!

Wrap your every ImageView in FrameLayout like this.
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="2">
<FrameLayout
android:layout_width="90dp"
android:layout_height="90dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/cases"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
android:background="#android:color/red"
android:layout_gravity="top|end"/>
</FrameLayout>
</GridLayout>

<RelativeLayout
android:layout_width="100dp"
android:layout_height="100dp">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#fc0505"
android:text="10"
android:layout_alignParentRight="true"
android:textSize="18sp"/>
</RelativeLayout>

Wrap your images inside GridLayout with RelativeLayout and put the notificaton indicators inside RelativeLayout.
Example:
<RelativeLayout
android:layout_width="90dp"
android:layout_height="90dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/cases"
android:layout_marginLeft="60dp"
android:layout_marginTop="40dp"
android:id="#+id/img_cases"/>
<TextView
android:id="#+id/item1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:background="#FF0000"/>
</RelativeLayout>
and you can update them via
GridLayout gridLayout....
TextView item1 = (TextView) gridLayout.findViewById(R.id.item1);
item1.setText("3"); // 3 notifications

You can use a Constraint layout as follows :
<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">
<ImageView
android:id="#+id/filter"
android:layout_width="30dp"
android:layout_height="30dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:srcCompat="#drawable/ic_baseline_filter_list_24px" />
<TextView
android:id="#+id/counter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/circular_border"
android:gravity="center"
android:textSize="10sp"
android:textColor="#FFFFFF"
card_view:layout_constraintStart_toEndOf="#string/filter"
card_view:layout_constraintEnd_toEndOf="parent"
card_view:layout_constraintTop_toTopOf="#id/filter"/>
</androidx.constraintlayout.widget.ConstraintLayout>
Add a Drawable resource file for adding background to counter as follows :
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:colorControlHighlight">
<item xmlns:android="http://schemas.android.com/apk/res/android">
<shape android:shape="oval">
<solid android:color="#DD2C00" />
<stroke android:color="#FFFFFF" android:width="1dp" />
<size
android:height="15dp"
android:width="15dp" />
</shape>
</item>
</ripple>

Related

OnClick item in NavigationDrawer in Android Studio

I know this is common to ask but I really confused about how can I apply onClickListener to my navigationDrawer items, I have two items which is edit profile and Logout I just want to Toast or print if one of them is selected, Is there anyone can help me with this, I've already search on the internet , yet there's no OnClickListener I've found, need help
I think there's missing on my MainActivity which is the onCreate()
OnCreate() MainActivity
setContentView(R.layout.dashboard_main);
DrawerLayout drawerLayout = findViewById(R.id.drawerlayout);
NavigationView navigationView = (NavigationView) findViewById(R.id.navigationview);
sidemenu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<group android:checkableBehavior = "single">
<item android:id="#+id/editProfile"
android:icon="#drawable/history"
android:title="Edit Profile"/>
<item android:id="#+id/logout_menu"
android:icon="#drawable/logout"
android:title="Logout"/>
</group>
sidebar_header
<?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="180dp"
android:background="#color/dashboard_item_1"
android:orientation="vertical"
android:gravity="center"
android:padding="20dp"
>
<de.hdodenhof.circleimageview.CircleImageView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/profile_image"
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/user_logo"
app:civ_border_width="2dp"
app:civ_border_color="#FFFFFF"/>
<TextView
android:id="#+id/fullName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="User"
android:textColor="#FFFFFF"
android:textSize="15sp"
android:textStyle="bold"/>
<TextView
android:id="#+id/idNumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Id no."
android:textColor="#FFFFFF"
android:textSize="12sp"/>
</LinearLayout>
dashboard_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.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:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/background"
android:id="#+id/drawerlayout"
tools:context=".MainActivity">
<com.google.android.material.navigation.NavigationView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/navigationview"
app:headerLayout="#layout/sidebar_header"
app:menu="#menu/sidemenu"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_gravity="start"/>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/background"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:title="Toolbars"
app:titleTextColor="#FFFFFF"
app:titleMarginStart = "10dp"
android:layout_marginBottom="5dp"
tools:ignore="MissingConstraints"/>
<View
android:id="#+id/viewHeaderBackground"
android:layout_width="match_parent"
android:layout_height="#dimen/_125sdp"
android:background="#color/primary"
app:layout_constraintTop_toTopOf="parent"/>
<TextView
android:id="#+id/textTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/_16sdp"
android:layout_marginLeft="#dimen/_16sdp"
android:layout_marginTop="#dimen/_16sdp"
android:text="Dashboard"
android:textColor="#color/white"
android:textSize="#dimen/_20ssp"
android:textStyle="bold"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
<androidx.appcompat.widget.AppCompatImageView
android:layout_width="#dimen/_26sdp"
android:layout_height="#dimen/_26sdp"
android:layout_marginEnd="#dimen/_16sdp"
android:layout_marginRight="#dimen/_16sdp"
android:src="#drawable/user_logo"
app:layout_constraintBottom_toBottomOf="#id/textTitle"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="#id/textTitle"
/>
<com.google.android.material.card.MaterialCardView
android:id="#+id/cardHeader"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/_16sdp"
android:layout_marginEnd="#dimen/_16sdp"
app:cardBackgroundColor="#color/card_background"
app:cardCornerRadius="#dimen/_16sdp"
app:layout_constraintBottom_toBottomOf="#id/viewHeaderBackground"
app:layout_constraintTop_toBottomOf="#id/viewHeaderBackground">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="#dimen/_14sdp">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Overview"
android:textColor="#color/primary_text"
android:textSize="#dimen/_14ssp"
android:textStyle="bold"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<ImageButton
android:id="#+id/textViews"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:background="#android:color/transparent"
android:layout_marginTop="#dimen/_8sdp"
android:scaleType="fitCenter"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<LinearLayout
android:id="#+id/layoutClients"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_8sdp"
android:gravity="center"
android:orientation="vertical"
app:layout_constraintEnd_toStartOf="#id/layoutImpacted"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/textViews">
<androidx.appcompat.widget.AppCompatImageView
android:layout_width="#dimen/_28sdp"
android:layout_height="#dimen/_28sdp"
android:src="#drawable/ic_clients"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_4sdp"
android:text="Pending"
android:textColor="#color/secondary_text"
android:textSize="#dimen/_10ssp"/>
<TextView
android:id="#+id/txtPending"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_4sdp"
android:text="0"
android:textColor="#color/primary_text"
android:textSize="#dimen/_16ssp"/>
</LinearLayout>
<LinearLayout
android:id="#+id/layoutImpacted"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_8sdp"
android:gravity="center"
android:orientation="vertical"
app:layout_constraintEnd_toStartOf="#id/layoutFollowing"
app:layout_constraintStart_toEndOf="#id/layoutClients"
app:layout_constraintTop_toBottomOf="#id/textViews">
<androidx.appcompat.widget.AppCompatImageView
android:layout_width="#dimen/_28sdp"
android:layout_height="#dimen/_28sdp"
android:src="#drawable/ic_impacted"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_4sdp"
android:text="Approved"
android:textColor="#color/secondary_text"
android:textSize="#dimen/_10ssp"/>
<TextView
android:id="#+id/txtApproved"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_4sdp"
android:text="0"
android:textColor="#color/primary_text"
android:textSize="#dimen/_16ssp"/>
</LinearLayout>
<LinearLayout
android:id="#+id/layoutFollowing"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_8sdp"
android:gravity="center"
android:orientation="vertical"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#id/layoutImpacted"
app:layout_constraintTop_toBottomOf="#id/textViews">
<androidx.appcompat.widget.AppCompatImageView
android:layout_width="#dimen/_28sdp"
android:layout_height="#dimen/_28sdp"
android:src="#drawable/ic_following"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_4sdp"
android:text="Records"
android:textColor="#color/secondary_text"
android:textSize="#dimen/_10ssp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_4sdp"
android:text="0"
android:textColor="#color/primary_text"
android:textSize="#dimen/_16ssp"/>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</com.google.android.material.card.MaterialCardView>
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:clipToPadding="false"
android:overScrollMode="never"
android:padding="#dimen/_16sdp"
android:scrollbars="none"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/cardHeader">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include layout="#layout/dashboard_item_1"/>
<include layout="#layout/dashboard_item_2"/>
<include layout="#layout/dashboard_item_3"/>
<include layout="#layout/dashboard_item_4"/>
</LinearLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.drawerlayout.widget.DrawerLayout >
Updated I tried the code below but when I click the items it will automatically hide back the sidebar and there are no Toast pops
navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
#Override
public boolean onNavigationItemSelected(MenuItem item) {
if (item.getItemId() == R.id.editProfile)
{
Toast.makeText(getApplicationContext(),"profile",Toast.LENGTH_SHORT).show();
}
else if (item.getItemId() == R.id.logout_menu)
{
Toast.makeText(getApplicationContext(),"logout",Toast.LENGTH_SHORT).show();
}
return false;
}
});

First you need to implement NavigationView.OnNavigationItemSelectedListener interface on your Activity.
then on your onCreate() method type
navigationView.setNavigationItemSelectedListener(this); after this override the method onNavigationItemSelected.
here you can use this sample code.
#Override
public boolean onNavigationItemSelected(#NonNull MenuItem item) {
if (item.getItemId() == R.id.editProfile)
{
//edit your profile
}
else if (item.getItemId() == R.id.logout)
{
//log out
}
return false;
}

Grouped Recyclerview only showing one column on child

I have a Android Java app with a grouped recycler view. The app is maded with Mvvm pattern. I have headers who also have recyclerviews, and I show or hide it based on a value. The list loads ok, and the hide/show works ok, but I don't get two columns on the child recyclerview.
This is the Header Item:
<layout
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">
<data>
<import type="android.view.View"/>
<variable
name="model"
type="package.ItemCredentialHeader" />
</data>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<FrameLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/headerName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:layout_marginHorizontal="20dp"
android:layout_marginTop="20dp"
android:text="#{model.title}"
android:textColor="#color/black"
tools:text="TITLE"/>
<TextView
android:id="#+id/headerclick"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:layout_marginHorizontal="20dp"
android:layout_marginTop="20dp"
android:text="Hide"
android:textColor="#color/black" />
</FrameLayout>
<!--Child RecyclerView-->
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/child_recyclerview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:itemsAdapter="#{model.credentialsList}"
android:visibility="#{model.folded ? View.GONE : View.VISIBLE}"
app:layoutManager="androidx.recyclerview.widget.GridLayoutManager"
app:spanCount="2"
tools:listitem="#layout/item_credential" />
</LinearLayout>
This is the Item
<?xml version="1.0" encoding="utf-8"?>
<layout 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">
<data>
<variable
name="model"
type="package.ItemCredentialProfile" />
</data>
<androidx.cardview.widget.CardView
android:layout_width="180dp"
android:layout_height="wrap_content"
app:cardCornerRadius="10dp"
app:cardElevation="5dp"
app:cardUseCompatPadding="true">
<LinearLayout
android:background="#drawable/background_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/credentialData"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginHorizontal="15dp"
android:layout_marginTop="20dp"
android:fontFamily="#font/opensans_bold"
android:text="#{model.data}"
android:textColor="#color/black"
tools:text="DATO" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginHorizontal="15dp"
android:text="#{model.typeName}"
android:textColor="#color/black"
android:textSize="13sp"
tools:text="Type" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginHorizontal="15dp"
android:layout_marginBottom="10dp"
android:text="#{model.issuer}"
android:textColor="#color/black"
android:textSize="12sp"
tools:text="Issuer" />
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginHorizontal="15dp"
android:layout_marginBottom="20dp"
android:background="#drawable/background_status"
android:statusColor="#{model.status}"
tools:backgroundTint="#color/status_green">
<TextView
android:layout_width="70dp"
android:layout_height="wrap_content"
android:layout_marginHorizontal="8dp"
android:layout_marginVertical="3dp"
android:statusText="#{model.status}"
android:textColor="#color/white"
android:textSize="12sp"
tools:text="status" />
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/background_card_left">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginHorizontal="15dp"
android:layout_marginVertical="10dp"
android:text="View detail >"
android:textColor="#color/light_blue_900"
android:textSize="12sp" />
</FrameLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
And this is the RecyclerView
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/actions_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginTop="55dp"
android:layout_marginEnd="20dp"
android:clipChildren="false"
android:clipToPadding="false"
android:itemClick="#{viewModel}"
android:itemsAdapter="#{viewModel.headersList}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/searchView"
tools:listitem="#layout/item_credential_header"/>
That is how Android studio shows me the list:
But that's what I got on the device...
It doesn't matter how much groups or elements I have I only get one column

So... at the end it was all my fault...
I was setting the layout manager this way
#BindingAdapter({"android:itemsAdapter"})
public static void addItems(RecyclerView recyclerView,
LiveData<List<ListItem>> actions) {
if(actions!=null && actions.getValue()!=null) {
RecyclerViewAdapter recyclerViewAdapter = new RecyclerViewAdapter(actions.getValue());
recyclerView.setLayoutManager(new LinearLayoutManager(recyclerView.getContext()));
recyclerView.setAdapter(recyclerViewAdapter);
}
}
I solved just adding a new binding adapter for the child recyclerview
#BindingAdapter({"android:itemsGridAdapter"})
public static void addItemsToGrid(RecyclerView recyclerView,
LiveData<List<ListItem>> actions) {
if(actions!=null && actions.getValue()!=null) {
RecyclerViewAdapter recyclerViewAdapter = new RecyclerViewAdapter(actions.getValue());
recyclerView.setLayoutManager(new GridLayoutManager(recyclerView.getContext(),2));
recyclerView.setAdapter(recyclerViewAdapter);
}
}

Floating Action Button hide and show when scroll in scrollview android?

I have a nestedscrollview with content like some RelativeLayout, CardViews and textviews. I am using a floatingactionbutton library for some reasons, as well. So I can't use any behavior for it. I don't know how I should handle the scrollchangelistener from scrollview to hide and show the fab dynamically like a behavior.
Now, When programs or output cover full page of intent, the fab is totally disappeared. It may be behind the content. I cant access fab. I want the FloatingActionButton over the scrollview. Or show and hide the fab is also need. Please tell how to achieve that concept?
Any suggestions how to hide and show the fab while scrolling?
<ScrollView
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:fab="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:scrollbars="none"
android:background="#fff"
android:fillViewport="true"
xmlns:android="http://schemas.android.com/apk/res/android">
<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=".programs.PrintANumber">
<android.support.v7.widget.CardView
android:id="#+id/program_title_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="6dp"
app:cardElevation="2dp"
android:layout_below="#id/definition_content"
android:layout_centerHorizontal="true"
app:contentPadding="15dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Print a Number"
android:textColor="#color/colorPrimaryDark"
android:textAlignment="center"
android:textSize="20sp"
android:textStyle="bold"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/sourcecode_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="6dp"
app:cardElevation="2dp"
android:layout_below="#id/program_title_card"
android:layout_centerHorizontal="true"
app:contentPadding="6dp">
<thereisnospon.codeview.CodeView
android:id="#+id/program"
android:layout_width="match_parent"
android:layout_height="match_parent">
</thereisnospon.codeview.CodeView>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/output_title_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="6dp"
app:cardElevation="2dp"
android:layout_below="#id/sourcecode_card"
android:layout_centerHorizontal="true"
app:contentPadding="15dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Output"
android:textColor="#color/colorPrimaryDark"
android:textAlignment="center"
android:textSize="20sp"
android:textStyle="bold"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/output_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="6dp"
app:cardElevation="2dp"
android:layout_below="#id/output_title_card"
android:layout_centerHorizontal="true"
app:contentPadding="6dp">
<thereisnospon.codeview.CodeView
android:id="#+id/output"
android:layout_width="match_parent"
android:layout_height="match_parent">
</thereisnospon.codeview.CodeView>
</android.support.v7.widget.CardView>
<com.github.clans.fab.FloatingActionMenu
android:id="#+id/menu"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="bottom|end"
android:paddingRight="10dp"
android:paddingBottom="10dp"
android:paddingLeft="10dp"
fab:menu_labels_ellipsize="end"
fab:menu_labels_singleLine="true"
app:menu_icon="#drawable/fab_add"
fab:menu_backgroundColor="#ccffffff"
app:menu_colorNormal="#color/lightGrey"
android:elevation="2dp">
<com.github.clans.fab.FloatingActionButton
android:id="#+id/id_opt1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/opt1"
android:padding="5dp"
fab:fab_size="mini"
fab:fab_label="Option1"
app:rippleColor="#color/colorAccent"
app:fab_colorNormal="#color/colorAccent" />
<com.github.clans.fab.FloatingActionButton
android:id="#+id/id_opt2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/opt2"
android:padding="5dp"
fab:fab_size="mini"
fab:fab_label="Option2"
app:rippleColor="#color/colorAccent"
app:fab_colorNormal="#color/colorAccent" />
</com.github.clans.fab.FloatingActionMenu>
</RelativeLayout>

Try like this.
private int oldScrollYPostion = 0; // inside your class
mScrollView.getViewTreeObserver().addOnScrollChangedListener(new ViewTreeObserver.OnScrollChangedListener() {
#Override
public void onScrollChanged() {
if (mScrollView.getScrollY() > oldScrollYPostion) {
fab.hide();
} else if (mScrollView.getScrollY() < oldScrollYPostion || mScrollView.getScrollY() <= 0) {
fab.show();
}
oldScrollYPostion = mScrollView.getScrollY();
}
});

You are using Floating action inside the scroll view tag. take it out of scroll view.
Use something like this:
<RelativeLayout
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:fab="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res-auto">
<com.github.clans.fab.FloatingActionMenu
android:id="#+id/menu"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="bottom|end"
android:paddingRight="10dp"
android:paddingBottom="10dp"
android:paddingLeft="10dp"
fab:menu_labels_ellipsize="end"
fab:menu_labels_singleLine="true"
app:menu_icon="#drawable/fab_add"
fab:menu_backgroundColor="#ccffffff"
app:menu_colorNormal="#color/lightGrey"
android:elevation="2dp">
<com.github.clans.fab.FloatingActionButton
android:id="#+id/id_opt1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/opt1"
android:padding="5dp"
fab:fab_size="mini"
fab:fab_label="Option1"
app:rippleColor="#color/colorAccent"
app:fab_colorNormal="#color/colorAccent" />
<com.github.clans.fab.FloatingActionButton
android:id="#+id/id_opt2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/opt2"
android:padding="5dp"
fab:fab_size="mini"
fab:fab_label="Option2"
app:rippleColor="#color/colorAccent"
app:fab_colorNormal="#color/colorAccent" />
</com.github.clans.fab.FloatingActionMenu>
<ScrollView
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:fab="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:scrollbars="none"
android:background="#fff"
android:fillViewport="true"
xmlns:android="http://schemas.android.com/apk/res/android">
<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=".programs.PrintANumber">
<android.support.v7.widget.CardView
android:id="#+id/program_title_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="6dp"
app:cardElevation="2dp"
android:layout_below="#id/definition_content"
android:layout_centerHorizontal="true"
app:contentPadding="15dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Print a Number"
android:textColor="#color/colorPrimaryDark"
android:textAlignment="center"
android:textSize="20sp"
android:textStyle="bold"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/sourcecode_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="6dp"
app:cardElevation="2dp"
android:layout_below="#id/program_title_card"
android:layout_centerHorizontal="true"
app:contentPadding="6dp">
<thereisnospon.codeview.CodeView
android:id="#+id/program"
android:layout_width="match_parent"
android:layout_height="match_parent">
</thereisnospon.codeview.CodeView>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/output_title_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="6dp"
app:cardElevation="2dp"
android:layout_below="#id/sourcecode_card"
android:layout_centerHorizontal="true"
app:contentPadding="15dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Output"
android:textColor="#color/colorPrimaryDark"
android:textAlignment="center"
android:textSize="20sp"
android:textStyle="bold"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/output_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="6dp"
app:cardElevation="2dp"
android:layout_below="#id/output_title_card"
android:layout_centerHorizontal="true"
app:contentPadding="6dp">
<thereisnospon.codeview.CodeView
android:id="#+id/output"
android:layout_width="match_parent"
android:layout_height="match_parent">
</thereisnospon.codeview.CodeView>
</android.support.v7.widget.CardView>
</RelativeLayout>
</ScrollView>
</RelativeLayout>

Inflating a LinearLayout dynamically - Android

I'm trying to inflate a list of views in a LinarLayout directly in the onCreate() method from the activity. However, I'm having a problem somewhere in the code but I really can't see it, I'm turning around this problem for two days, I'm going crazy !
The problem is that when I run the activity, the linear layout is completely empty, there is only the title.
Here is the important part of the code, KeyItems activity :
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.keyitems_layout);
initializer();
ll = (LinearLayout) findViewById(R.id.ll);
LayoutInflater inflater = LayoutInflater.from(this);
for (int i = 0; i < list.size(); i++) {
View view = inflater.inflate(R.layout.keyitem_temp, ll, false);
final TextView ind = (TextView) view.findViewById(R.id.ind);
final TextView item = (TextView) view.findViewById(R.id.item);
ind.setText(list.get(i).get("id"));
item.setText(list.get(i).get("item"));
ll.addView(view);
}
}
Here is the keyitems_layout :
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/black" >
<LinearLayout android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/black">
<TextView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="8dp" />
<TextView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="#string/key_items"
android:textSize="36sp"
android:textColor="#color/white" />
<TextView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="4dp" />
<LinearLayout android:id="#+id/ll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="32dp"
android:layout_marginRight="32dp"
android:orientation="vertical"
android:background="#color/white" >
</LinearLayout>
<TextView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:text="caca"
android:padding="32dp" />
</LinearLayout>
</ScrollView>
And finally, my keyitem_temp.xml which I'm inflating :
<?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="wrap_content"
android:background="#color/black"
android:padding="4dp"
android:orientation="horizontal" >
<TextView android:id="#+id/ind"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:textSize="18sp"
android:textColor="#color/blue" />
<TextView android:id="#+id/item"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:textSize="18sp"
android:textColor="#color/white"/>
</LinearLayout>
I have an other activity called ItemsActivity which is the same code with some little differences and it works. Any suggestion? Thanks in advance.

Try using wrap_content for all of your heights except the initial ScrollView:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/black" >
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#color/black">
<TextView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="8dp" />
<TextView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="#string/key_items"
android:textSize="36sp"
android:textColor="#color/white" />
<TextView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="4dp" />
<LinearLayout android:id="#+id/ll"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="32dp"
android:layout_marginRight="32dp"
android:orientation="vertical"
android:background="#color/white" >
</LinearLayout>
<TextView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:text="caca"
android:padding="32dp" />
</LinearLayout>
</ScrollView>
and:
<?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="wrap_content"
android:background="#color/black"
android:padding="4dp"
android:orientation="horizontal" >
<TextView android:id="#+id/ind"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:textSize="18sp"
android:textColor="#color/blue" />
<TextView android:id="#+id/item"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:textSize="18sp"
android:textColor="#color/white"/>
</LinearLayout>

How to animate changing the alpha of a FrameLayout's foreground drawable?

I am trying to find a way to animate changing the alpha of a FrameLayout's foreground drawable, but i cant seem to find a way of doing it.
If someone could point me in the right direction as to how i should go about this i would be hugely grateful.
The relevant code is below:
XML layout file:
<com.bacon.corey.audiotimeshift.SlidingUpPanelLayout xmlns:sothree="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/sliding_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
sothree:panelHeight="0dp"
sothree:shadowHeight="10dp"
sothree:paralaxOffset="100dp"
sothree:fadeColor="#android:color/transparent"
>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:padding="0dp"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:padding="0dip"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="0dp"
android:id="#+id/recordingListMainLayout"
android:foreground="#drawable/dim_shadow_shape_dark"
>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:padding="0dp"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/mainLayoutContainer"/>
<!--
<android.support.v4.view.ViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1"
android:padding="0dp"
android:layout_margin="0dp"
/>
-->
</LinearLayout>
</FrameLayout>
<com.bacon.corey.audiotimeshift.FloatingActionsMenu
android:id="#+id/fabMenu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:gravity="right"
app:fab_addButtonColorNormal="#color/holo_red_light"
app:fab_addButtonColorPressed="#color/c16"
app:fab_addButtonPlusIconColor="#color/white"
app:fab_expandDirection="up"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:layout_marginBottom="10dp"
android:layout_marginEnd="10dp"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_vertical"
>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/textview_rounded_corner_background_fam"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option Four"
android:textAlignment="center"
android:padding="6dp"
android:fontFamily="sans-serif-medium"
/>
</FrameLayout>
<com.bacon.corey.audiotimeshift.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:fab_colorNormal="#color/c15"
app:fab_colorPressed="#color/c15"
app:fab_size="mini"
/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_vertical"
>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/textview_rounded_corner_background_fam"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option Four"
android:textAlignment="center"
android:padding="6dp"
android:fontFamily="sans-serif-medium"
/>
</FrameLayout>
<com.bacon.corey.audiotimeshift.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:fab_colorNormal="#color/c8"
app:fab_colorPressed="#color/c8"
app:fab_size="mini"
/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_vertical"
>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/textview_rounded_corner_background_fam"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option Four"
android:textAlignment="center"
android:padding="6dp"
android:fontFamily="sans-serif-medium"
/>
</FrameLayout>
<com.bacon.corey.audiotimeshift.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:fab_colorNormal="#color/a1"
app:fab_colorPressed="#color/a1"
app:fab_size="mini"
/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_vertical"
>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/textview_rounded_corner_background_fam"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option Four"
android:textAlignment="center"
android:padding="6dp"
android:fontFamily="sans-serif-medium"
/>
</FrameLayout>
<com.bacon.corey.audiotimeshift.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:fab_colorNormal="#color/a2"
app:fab_colorPressed="#color/a2"
app:fab_size="mini"
/>
</LinearLayout> </com.bacon.corey.audiotimeshift.FloatingActionsMenu>
</RelativeLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center|top"
android:textSize="16sp"
android:id="#+id/slideUpPanel"
>
</FrameLayout>
</com.bacon.corey.audiotimeshift.SlidingUpPanelLayout>
And the java code that i use to change the alpha of the foreground:
fabMain.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
boolean expanded = fabMenu.toggle();
mainActivity.getDimShadowDrop().setForeground(getResources().getDrawable(R.drawable.dim_shadow_shape_light));
mainActivity.getDimShadowDrop().getForeground().setAlpha(180);
if (expanded){
((MainActivity)getActivity()).replaceFragment(new RecordFragment(), R.id.slideUpPanel, false);
slidingUpPanelLayout.expandPanel();
defaultColor = getResources().getColor(R.color.recordDefaultColor);
}
}
});

Instead of the typical way you do it with an Animation which is from 0 to 1 you use 0 to 255. Something like this will pulse the Foreground of a CardView.
public static void pulseForeground(CardView view, long duration) {
ObjectAnimator animator = ObjectAnimator.ofInt(view.getForeground(), "alpha", 0, 255);
animator.setDuration(duration);
animator.setStartDelay(20);
animator.setRepeatMode(Animation.REVERSE);
animator.setRepeatCount(Animation.INFINITE);
animator.start();
}

Develop Reference

Java is a programming language and computing platform first released by Sun Microsystems in 1995.

Android - How to add Notification Counter on the right above of ImageView - java

Related

OnClick item in NavigationDrawer in Android Studio

Grouped Recyclerview only showing one column on child

Floating Action Button hide and show when scroll in scrollview android?

Inflating a LinearLayout dynamically - Android

How to animate changing the alpha of a FrameLayout's foreground drawable?

Categories

Resources