0

I am trying to animate a Cardview when FAB is pressed. I want to get circular animation. Initially Cardview is set to Invisible. But, it is trowing null object reference on CardView.setVisibility.

public class FeedFragment extends Fragment {

private FloatingActionButton floatingBtn;
private CardView cardView;
boolean flag = true;
public FeedFragment() {
    // Required empty public constructor
}

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    // Inflate the layout for this fragment
    View view = inflater.inflate(R.layout.fragment_feed, container, false);

    floatingBtn = view.findViewById(R.id.floatBtn);
    cardView = view.findViewById(R.id.cardView);

    floatingBtn.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {

            if(flag) {

                // Check if the runtime version is at least Lollipop
                if (Build.VERSION.SDK_INT == Build.VERSION_CODES.LOLLIPOP) {
                    // get the center for the clipping circle
                    int cx = cardView.getWidth() / 2;
                    int cy = cardView.getHeight() / 2;

                    // get the final radius for the clipping circle
                    float finalRadius = (float) Math.hypot(cx, cy);

                    // create the animator for this view (the start radius is zero)
                    Animator anim =
                            ViewAnimationUtils.createCircularReveal(cardView, cx, cy, 0, finalRadius);

                    // make the view visible and start the animation
                    cardView.setVisibility(View.VISIBLE);
                    anim.start();
                } else {
                    // set the view to visible without a circular reveal animation below Lollipop
                    cardView.setVisibility(View.VISIBLE);
                }

                flag = false;
            } else {

                // Check if the runtime version is at least Lollipop
                if (Build.VERSION.SDK_INT == Build.VERSION_CODES.LOLLIPOP) {
                    // get the center for the clipping circle
                    int cx = cardView.getWidth() / 2;
                    int cy = cardView.getHeight() / 2;

                    // get the initial radius for the clipping circle
                    float initialRadius = (float) Math.hypot(cx, cy);

                     // create the animation (the final radius is zero)
                    Animator anim =
                            ViewAnimationUtils.createCircularReveal(cardView, cx, cy, initialRadius, 0);

                   // make the view invisible when the animation is done
                    anim.addListener(new AnimatorListenerAdapter() {
                        @Override
                        public void onAnimationEnd(Animator animation) {
                            super.onAnimationEnd(animation);
                            cardView.setVisibility(View.INVISIBLE);
                        }
                    });

                 // start the animation
                    anim.start();
                } else {
                    // set the view to visible without a circular reveal animation below Lollipop
                    cardView.setVisibility(View.VISIBLE);
                }
                flag = true;
            }

        }
    });

    return view;
   }
  }

Here is the XML code

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="com.authent.authentication.FeedFragment">

<!-- TODO: Update blank fragment layout -->

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:layout_gravity="bottom">

    <android.support.v7.widget.CardView
        android:id="@+id/cardView"
        android:layout_width="match_parent"
        android:layout_height="208dp"
        android:layout_gravity="bottom"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:layout_marginStart="16dp"
        app:cardCornerRadius="20dp"
        android:visibility="gone">

        <LinearLayout
            android:id="@+id/linearReveal"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:visibility="gone">

            <Button
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:background="@color/white"
                android:text="Ask a Query"
                android:textSize="24dp"
                android:textAllCaps="false"
                android:textColor="#00ccff"/>

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@android:color/darker_gray"/>

            <Button
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:background="@color/white"
                android:text="Share Something"
                android:textSize="24dp"
                android:textAllCaps="false"
                android:textColor="#ff3300"/>

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@android:color/darker_gray"/>

            <Button
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:background="@color/white"
                android:text="Post an MCQ"
                android:textSize="24dp"
                android:textAllCaps="false"
                android:textColor="#cc9900"/>

        </LinearLayout>

    </android.support.v7.widget.CardView>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/floatBtn"
        android:layout_width="56dp"
        android:layout_height="56dp"
        android:layout_gravity="end"
        android:layout_marginEnd="16dp"
        android:layout_marginBottom="16dp"
        android:layout_marginRight="16dp"
        android:src="@drawable/edit_nick_name" />

</LinearLayout>

Somebody help how to achieve circular animation. I am new to programming. I also tried making LinearLayout INVISIBLE, it is also throwing NullPointerException on LinearLayout.setVisibility on a null object reference. Thanks in advance.

Thrinadh Reddy
  • 525
  • 2
  • 8
  • 17
  • 3
    Possible duplicate of [What is a NullPointerException, and how do I fix it?](https://stackoverflow.com/questions/218384/what-is-a-nullpointerexception-and-how-do-i-fix-it) – Logan Mar 24 '18 at 07:19
  • 1
    In your `onclick(View view)` you have used `cardView = view.findViewById(R.id.cardView);`. here the view is local object that is **onclick view object** – Jyoti JK Mar 24 '18 at 07:30

3 Answers3

0

Intilaize cardview outside of the "clickListener".

sak
  • 1,230
  • 18
  • 37
0

Your CardView is null. Based on your code, you are trying to get the CardView from the View that received the onClick which is the FloatingButton.

Try calling the initialization outside just before the listener. Ideally on the same level as where you initialized the FloatingButton.

Jojo Narte
  • 2,767
  • 2
  • 30
  • 52
  • yes. worked but Buttons are not appearing on cardview. How to do that – Thrinadh Reddy Mar 24 '18 at 07:33
  • @ThrinadhReddy how about instead of making the CardView GONE, how about you hide the Cardview's container instead, which is the LinearLayout? Then you show it, then still apply the animation on the CardView. – Jojo Narte Mar 24 '18 at 07:35
  • But, I want to hide cardview too. – Thrinadh Reddy Mar 24 '18 at 07:38
  • @ThrinadhReddy doesn't hiding the LinearLayout that hides the CardView hide it also? – Jojo Narte Mar 24 '18 at 07:39
  • Thank You. solved. But, when I click again the FAB button, it is not going to invisible state. I have posted the full code. please tell me where it went wrong – Thrinadh Reddy Mar 24 '18 at 07:48
  • @ThrinadhReddy your code didn't have any code that makes it back to invisible state. Basically a simple approach to that is to do boolean visibility = cardView.getVisibility(); then cardView.setVisibility(!visibility); or somethign like that. Or just keep a flag for the state of visibility for your cardView within the Fragment class. – Jojo Narte Mar 24 '18 at 07:51
  • I have added the full code.. tell me where i went wrong – Thrinadh Reddy Mar 24 '18 at 07:54
  • @ThrinadhReddy can you add a breakpoint and see if this was called. cardView.setVisibility(View.INVISIBLE); – Jojo Narte Mar 24 '18 at 07:57
  • I have edited the code.. have a look at it and please tell me. why it is not working – Thrinadh Reddy Mar 24 '18 at 07:58
  • You can easily check it with the debug feature of the Android Studio, to see if the code where you set it to INVISIBLE was actually called. Or even via Log. – Jojo Narte Mar 24 '18 at 08:01
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/167458/discussion-between-jojo-narte-and-thrinadh-reddy). – Jojo Narte Mar 24 '18 at 08:01
0

You just need to remove this line cardView = view.findViewById(R.id.cardView);

and paste it before

    floatingBtn.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {


       return view;
 }
Arul Harsh
  • 133
  • 9