0

I'm currently making a soundboard app for Android with custom neomorphic buttons. My goal for the app is for the button to change style (look like it's pressed) when I click it using an onTouchListener. However my app crashes whenever I try to add an onTouchListener (in the initButton() function on MainAcitvity.java). I attached my code as well as links to the neomrphic library I used below:

Neomorphic View Library:
https://medium.com/@fornewid/neumorphism-in-android-9cf15e2122dc
https://github.com/fornewid/neumorphism

MainActivity.java
public class MainActivity extends AppCompatActivity {

    private SectionsPageAdapter mSectionsPageAdapter;
    private ViewPager mViewPager;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);



        TextView textView = findViewById(R.id.titleText);
        String text = "R6 Soundboard";
        SpannableString ss = new SpannableString(text);
        ForegroundColorSpan fcsYellow = new ForegroundColorSpan(Color.rgb(255,236,141));
        ss.setSpan(fcsYellow, 1,2, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
        textView.setText(ss);


        mSectionsPageAdapter = new SectionsPageAdapter(getSupportFragmentManager());

        mViewPager = (ViewPager) findViewById(R.id.view_pager);

        setUpViewPager(mViewPager);

        TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
        tabLayout.setTabTextColors(Color.WHITE, Color.WHITE);
        tabLayout.setupWithViewPager(mViewPager);
        tabLayout.getTabAt(0).setText("Defenders");
        tabLayout.getTabAt(1).setText("Attackers");

        initButton();
    }

    private void setUpViewPager(ViewPager viewPager) {
        SectionsPageAdapter adapter = new SectionsPageAdapter(getSupportFragmentManager());
        adapter.addFragment(new defendersTab(), "Defenders");
        adapter.addFragment(new attackersTab(), "Attackers");

        viewPager.setAdapter(adapter);

    }

    @SuppressLint("ClickableViewAccessibility")
    private void initButton(){
        final NeumorphCardView DefR1C1 = (NeumorphCardView) findViewById(R.id.buttonDR1C1);

        DefR1C1.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View view, MotionEvent event) {
                if(event.getAction() == MotionEvent.ACTION_UP) {
                    DefR1C1.setShapeType(ShapeType.PRESSED);
                } else if(event.getAction() == MotionEvent.ACTION_DOWN) {
                    DefR1C1.setShapeType(ShapeType.FLAT);
                }
                return false;
            }

        });




        /*
        final MediaPlayer mp = MediaPlayer.create(this, R.raw.lionroar);
        DefR1C1.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View view, MotionEvent event) {
                if(mp.isPlaying()) {
                    //STOP PLAYING
                    mp.seekTo(0);
                }
                mp.start();
                return false;
            }

        });

         */
    }

}

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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">

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorPrimaryDark"
        android:theme="@style/AppTheme.AppBarOverlay">

        <TextView
            android:id="@+id/titleText"
            android:layout_marginLeft="20dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:fontFamily="@font/avenir"
            android:layout_marginTop="20dp"
            android:gravity="center_horizontal"
            android:text="R6 Soundboard"
            android:textColor="#FFF"
            android:textSize="30sp" />

        <com.google.android.material.tabs.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabTextColor="#fff"
            android:background="?attr/colorPrimaryDark" />
    </com.google.android.material.appbar.AppBarLayout>

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/colorPrimaryDark"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

fragment_defenders_tab.xml

<?xml version="1.0" encoding="utf-8"?>
<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">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/colorPrimaryDark">

        <soup.neumorphism.NeumorphCardView
            android:id="@+id/buttonDR1C1"
            android:layout_width="175dp"
            android:layout_height="175dp"
            android:layout_alignParentStart="true"
            android:layout_marginStart="20dp"

            android:layout_marginTop="20dp"
            app:neumorph_backgroundColor="@color/colorPrimaryDark"
            app:neumorph_inset="12dp"
            app:neumorph_insetBottom="12dp"

            app:neumorph_insetEnd="12dp"
            app:neumorph_insetStart="12dp"
            app:neumorph_insetTop="12dp"
            app:neumorph_lightSource="leftTop"
            app:neumorph_shadowColorDark="@color/solid_dark_color"
            app:neumorph_shadowColorLight="@color/solid_light_color"
            app:neumorph_shadowElevation="3dp"
            app:neumorph_shapeType="flat">

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

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="62.5dp"
                    android:fontFamily="@font/proximanovasoft"
                    android:text="Lion Scan"
                    android:textColor="#ffffff"
                    android:textSize="20dp" />

            </LinearLayout>

        </soup.neumorphism.NeumorphCardView>

        <soup.neumorphism.NeumorphCardView
            android:id="@+id/buttonDR1C2"
            android:layout_width="175dp"
            android:layout_height="175dp"
            android:layout_alignParentTop="true"
            android:layout_alignParentEnd="true"

            android:layout_marginTop="20dp"
            android:layout_marginEnd="20dp"

            app:neumorph_backgroundColor="@color/colorPrimaryDark"
            app:neumorph_inset="12dp"
            app:neumorph_insetBottom="12dp"
            app:neumorph_insetEnd="12dp"
            app:neumorph_insetStart="12dp"
            app:neumorph_insetTop="12dp"
            app:neumorph_lightSource="leftTop"
            app:neumorph_shadowColorDark="@color/solid_dark_color"
            app:neumorph_shadowColorLight="@color/solid_light_color"
            app:neumorph_shadowElevation="3dp"
            app:neumorph_shapeType="flat">

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

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="62.5dp"
                    android:fontFamily="@font/proximanovasoft"
                    android:text="Thermite"
                    android:textColor="#ffffff"
                    android:textSize="20dp" />
            </LinearLayout>
        </soup.neumorphism.NeumorphCardView>

        <soup.neumorphism.NeumorphCardView
            android:id="@+id/buttonDR2C1"
            android:layout_width="175dp"
            android:layout_height="175dp"

            android:layout_below="@+id/buttonDR1C2"
            android:layout_alignParentEnd="true"
            android:layout_marginTop="11dp"
            android:layout_marginEnd="20dp"

            app:neumorph_backgroundColor="@color/colorPrimaryDark"
            app:neumorph_inset="12dp"
            app:neumorph_insetBottom="12dp"
            app:neumorph_insetEnd="12dp"
            app:neumorph_insetStart="12dp"
            app:neumorph_insetTop="12dp"
            app:neumorph_lightSource="leftTop"
            app:neumorph_shadowColorDark="@color/solid_dark_color"
            app:neumorph_shadowColorLight="@color/solid_light_color"
            app:neumorph_shadowElevation="3dp"
            app:neumorph_shapeType="flat">

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

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="62.5dp"
                    android:fontFamily="@font/proximanovasoft"
                    android:text="Barricade"
                    android:textColor="#ffffff"
                    android:textSize="20dp" />
            </LinearLayout>
        </soup.neumorphism.NeumorphCardView>

        <soup.neumorphism.NeumorphCardView
            android:id="@+id/buttonDR2C2"
            android:layout_width="175dp"
            android:layout_height="175dp"

            android:layout_below="@+id/buttonDR1C1"
            android:layout_alignParentStart="true"
            android:layout_marginStart="20dp"
            android:layout_marginTop="12dp"
            app:neumorph_backgroundColor="@color/colorPrimaryDark"
            app:neumorph_inset="12dp"

            app:neumorph_insetBottom="12dp"
            app:neumorph_insetEnd="12dp"
            app:neumorph_insetStart="12dp"
            app:neumorph_insetTop="12dp"
            app:neumorph_lightSource="leftTop"
            app:neumorph_shadowColorDark="@color/solid_dark_color"
            app:neumorph_shadowColorLight="@color/solid_light_color"
            app:neumorph_shadowElevation="3dp"
            app:neumorph_shapeType="flat">

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

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="62.5dp"
                    android:fontFamily="@font/proximanovasoft"
                    android:text="Planting"
                    android:textColor="#ffffff"
                    android:textSize="20dp" />
            </LinearLayout>
        </soup.neumorphism.NeumorphCardView>

        <soup.neumorphism.NeumorphCardView
            android:id="@+id/buttonDR3C1"
            android:layout_width="175dp"
            android:layout_height="175dp"

            android:layout_below="@+id/buttonDR2C2"
            android:layout_alignParentEnd="true"
            android:layout_marginTop="11dp"
            android:layout_marginEnd="20dp"

            app:neumorph_backgroundColor="@color/colorPrimaryDark"
            app:neumorph_inset="12dp"
            app:neumorph_insetBottom="12dp"
            app:neumorph_insetEnd="12dp"
            app:neumorph_insetStart="12dp"
            app:neumorph_insetTop="12dp"
            app:neumorph_lightSource="leftTop"
            app:neumorph_shadowColorDark="@color/solid_dark_color"
            app:neumorph_shadowColorLight="@color/solid_light_color"
            app:neumorph_shadowElevation="3dp"
            app:neumorph_shapeType="flat">

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

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="62.5dp"
                    android:fontFamily="@font/proximanovasoft"
                    android:text="Fuze"
                    android:textColor="#ffffff"
                    android:textSize="20dp" />
            </LinearLayout>
        </soup.neumorphism.NeumorphCardView>

        <soup.neumorphism.NeumorphCardView
            android:id="@+id/buttonDR3C2"
            android:layout_width="175dp"
            android:layout_height="175dp"

            android:layout_below="@+id/buttonDR2C1"
            android:layout_alignParentStart="true"
            android:layout_marginStart="20dp"
            android:layout_marginTop="12dp"
            app:neumorph_backgroundColor="@color/colorPrimaryDark"
            app:neumorph_inset="12dp"

            app:neumorph_insetBottom="12dp"
            app:neumorph_insetEnd="12dp"
            app:neumorph_insetStart="12dp"
            app:neumorph_insetTop="12dp"
            app:neumorph_lightSource="leftTop"
            app:neumorph_shadowColorDark="@color/solid_dark_color"
            app:neumorph_shadowColorLight="@color/solid_light_color"
            app:neumorph_shadowElevation="3dp"
            app:neumorph_shapeType="flat">

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

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="62.5dp"
                    android:fontFamily="@font/proximanovasoft"
                    android:text="Drone"
                    android:textColor="#ffffff"
                    android:textSize="20dp" />
            </LinearLayout>
        </soup.neumorphism.NeumorphCardView>

    </RelativeLayout>

</FrameLayout>

SectionsPageAdapter.java

public class SectionsPageAdapter extends FragmentPagerAdapter {

    private final List<Fragment> mFragmentList = new ArrayList<>();
    private final List<String> mFragmentTitleList = new ArrayList<>();

    public void addFragment(Fragment fragment, String title) {
        mFragmentList.add(fragment);
        mFragmentTitleList.add(title);
    }

    public SectionsPageAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return super.getPageTitle(position);
    }
    @Override
    public Fragment getItem(int position) {
        return mFragmentList.get(position);
    }
    @Override
    public int getCount() {
        return mFragmentList.size();
    }
}

edit: on request, I added the crash log and a picture of my app working before I tried to make the buttons actually work using onTouchListener

2020-12-14 10:54:31.781 8217-8217/? E/AndroidRuntime: FATAL EXCEPTION: main
Process: com.jkcarraher.rainbowsixsoundboard, PID: 8217
java.lang.RuntimeException: Unable to start activity ComponentInfo{com.jkcarraher.rainbowsixsoundboard/com.jkcarraher.rainbowsixsoundboard.MainActivity}: java.lang.NullPointerException: Attempt to invoke virtual method 'void soup.neumorphism.NeumorphCardView.setOnTouchListener(android.view.View$OnTouchListener)' on a null object reference
    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:3449)
    at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:3601)
    at android.app.servertransaction.LaunchActivityItem.execute(LaunchActivityItem.java:85)
    at android.app.servertransaction.TransactionExecutor.executeCallbacks(TransactionExecutor.java:135)
    at android.app.servertransaction.TransactionExecutor.execute(TransactionExecutor.java:95)
    at android.app.ActivityThread$H.handleMessage(ActivityThread.java:2066)
    at android.os.Handler.dispatchMessage(Handler.java:106)
    at android.os.Looper.loop(Looper.java:223)
    at android.app.ActivityThread.main(ActivityThread.java:7656)
    at java.lang.reflect.Method.invoke(Native Method)
    at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:592)
    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:947)
 Caused by: java.lang.NullPointerException: Attempt to invoke virtual method 'void soup.neumorphism.NeumorphCardView.setOnTouchListener(android.view.View$OnTouchListener)' on a null object reference
    at com.jkcarraher.rainbowsixsoundboard.MainActivity.initButton(MainActivity.java:70)
    at com.jkcarraher.rainbowsixsoundboard.MainActivity.onCreate(MainActivity.java:54)
    at android.app.Activity.performCreate(Activity.java:7995)
    at android.app.Activity.performCreate(Activity.java:7979)
    at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1309)
    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:3422)
    at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:3601) 
    at android.app.servertransaction.LaunchActivityItem.execute(LaunchActivityItem.java:85) 
    at android.app.servertransaction.TransactionExecutor.executeCallbacks(TransactionExecutor.java:135) 
    at android.app.servertransaction.TransactionExecutor.execute(TransactionExecutor.java:95) 
    at android.app.ActivityThread$H.handleMessage(ActivityThread.java:2066) 
    at android.os.Handler.dispatchMessage(Handler.java:106) 
    at android.os.Looper.loop(Looper.java:223) 
    at android.app.ActivityThread.main(ActivityThread.java:7656) 
    at java.lang.reflect.Method.invoke(Native Method) 
    at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:592) 
    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:947) 

Picture of my app working before I attempted to get the buttons to work
Thank you for any insight you can provide!

2 Answers2

1

Your NeumorphCardView is not initialized correctly, and that why it is throwing a NullPointerException. My guess is that you didn't set up your TabLayout in your activity_main.xml correctly. Specifically, what is your android:id="@+id/tabs" referring to? I don't think you successfully attached your fragment_defenders_tab to your activity_main successfully.

Zuo Wang
  • 11
  • 3
  • Hmmm. Well the program worked fine and displayed the app with swiping tab layout before. However as soon as I tried to declare a NeumorphCardView in my MainActivity.java file it crashed. "@+id/tabs" is the id I gave my tablayout. I attached a picture of my app working before I tried to declare the NeumorphCardView in my java. – John Carraher Dec 15 '20 at 02:38
  • Can you please attach your code where you defined the tabLayout with id="@+id/tabs"? – Zuo Wang Dec 15 '20 at 07:21
  • Sure! I attached it above. I'm not sure if it's a problem with my tabLayout because my tablayout was still able to display my buttons on the tablayout, but when I tried to make them clickable, the app crashed. – John Carraher Dec 15 '20 at 15:59
0

Your error is that your are using activity_main.xml in your MainActivity.java. However, the XML file you provided is called fragment_defenders_tab. You didn't reference this at all in your code.

So, the simple fix should be to just change this:

super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

To this:

super.onCreate(savedInstanceState);
setContentView(R.layout.fragment_defenders_tab);
SatvikVejendla
  • 424
  • 5
  • 14