Search code examples
androidandroid-fragmentsfloating-action-button

Change FloatingActionButton from a Fragment in a Tabbed Activity


How are you ? I am new in android programming. I am facing an issue that I have tried to handle. But, I couldn't. I have created a new project. Tabbed Activity.

I have changed some of it's settings. For each tab, I create a fragment. I kept the default floatingActionButton in the MainActity Layout. I tried to access it from a fragment.

An error arises. Here are my MainActivity class:

public class MainActivity extends AppCompatActivity {
private SectionsPagerAdapter mSectionsPagerAdapter;
private ViewPager mViewPager;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);
    // Create the adapter that will return a fragment for each of the three
    // primary sections of the activity.
    mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
    mViewPager = (ViewPager) findViewById(R.id.container);
    mViewPager.setAdapter(mSectionsPagerAdapter);

    TabLayout tabLayout = (TabLayout) findViewById(R.id.Main_FAB);

    mViewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
    tabLayout.addOnTabSelectedListener(new TabLayout.ViewPagerOnTabSelectedListener(mViewPager));


}

public class SectionsPagerAdapter extends FragmentPagerAdapter {
    public SectionsPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        switch (position)
        {
            case 0 : Summary summary = new Summary(); return summary ;
            case 1 : Expense_items expenseItems = new Expense_items(); return expenseItems;
            case 2 : Linage_items linage_items= new Linage_items(); return linage_items;
            default: return null;
        }
    }

    @Override
    public int getCount() {
        // Show 3 total pages.
        return 3;
    }
}
}

my Summary fragment as the followings:

public class Summary extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    View rootView = inflater.inflate(R.layout.fragment_summary, container, false);
    TextView summary_text = (TextView) rootView.findViewById(R.id.summary_text);
    summary_text.setText("You are in Summary Fragment Fragment");
    FloatingActionButton myFB  = (FloatingActionButton) rootView.findViewById(R.id.fab);

    return rootView;
}
}

In my MainActivity layout I created the floatingActionButton as the followings:

<android.support.design.widget.FloatingActionButton
    android:id="@+id/Main_FAB"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="end|bottom"
    android:layout_margin="@dimen/fab_margin"
    app:srcCompat="@android:drawable/ic_dialog_email" />

The reason I don't want to create a FloatingActionButton in my Fragments is because I don't want to change the location of it in the layout.


Solution

  • You have to handle the floating button in the MainActiviy that is handling all of your fragments. Try to do this in your MainActity:

             myFab = (FloatingActionButton) findViewById(R.id.Main_FAB);
        myFab.setImageDrawable(ContextCompat.getDrawable(getApplicationContext(), iconIntArray[0]));
    
        myFab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                int position = tabLayout.getSelectedTabPosition();
    
                switch (position) {
                    case 0:
                        myFab.setImageDrawable(ContextCompat.getDrawable(MainActivity.this, iconIntArray[0]));
    
                        intent = new Intent(MainActivity.this,
                                EnterExpensesActivity.class);
                        intent.putExtra("USER_ID",USER_ID);
                        intent.putExtra("FRAGMENT",0);
    
                        intent.putExtra("TITLE",getResources().getString(R.string.Enter_Expense_title));
                        intent.putExtra("FILED",getResources().getString(R.string.Enter_Expense_text));
                        startActivity(intent);
    
                        break;
                    case 1:
                        myFab.setImageDrawable(ContextCompat.getDrawable(MainActivity.this, iconIntArray[position]));
                        intent = new Intent(MainActivity.this,
                                Enter_E_L_Items.class);
                        intent.putExtra("USER_ID",USER_ID);
                        intent.putExtra("FRAGMENT",0);
    
                        intent.putExtra("TITLE",getResources().getString(R.string.Enter_Expense_title));
                        intent.putExtra("FILED",getResources().getString(R.string.Enter_Expense_text));
    
                        startActivity(intent);
                        /*
                        Snackbar.make(view, "Expenses ", Snackbar.LENGTH_LONG)
                                .setAction("Action", null).show();*/
                    break;
                    case 2:
                        myFab.setImageDrawable(ContextCompat.getDrawable(MainActivity.this, iconIntArray[position]));
                        intent = new Intent(MainActivity.this,
                                Enter_E_L_Items.class);
                        intent.putExtra("USER_ID",USER_ID);
                        intent.putExtra("FRAGMENT",1);
                        intent.putExtra("TITLE",getResources().getString(R.string.Enter_Liange_title));
                        intent.putExtra("FILED",getResources().getString(R.string.Enter_Linage_text));
    
                        startActivity(intent);
                        /*
                        Snackbar.make(view, "Linage ", Snackbar.LENGTH_LONG)
                                .setAction("Action", null).show();*/
                        break;
                }
            }
        });
    

    I am assuming that you are using the default Tab Activity

    You can change and set animation to the floating button as:

        tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                viewpager.setCurrentItem(tab.getPosition());
                animateFab(tab.getPosition());
            }
    
            @Override
            public void onTabUnselected(TabLayout.Tab tab) {
    
            }
    
            @Override
            public void onTabReselected(TabLayout.Tab tab) {
    
            }
        });
        setupTabIcons();
    
    }
    

    I have created the animateFab method as the followings:

        protected void animateFab(final int position) {
        final FloatingActionButton fab = findViewById(R.id.Main_FAB);
        fab.clearAnimation();
    
        // Scale down animation
        ScaleAnimation shrink = new ScaleAnimation(1f, 0.1f, 1f, 0.1f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
        shrink.setDuration(100);     // animation duration in milliseconds
        shrink.setInterpolator(new AccelerateInterpolator());
        shrink.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
    
            }
    
            @Override
            public void onAnimationEnd(Animation animation) {
                // Change FAB color and icon
                fab.setBackgroundTintList(ContextCompat.getColorStateList(getApplicationContext(), colorIntArray[position]));
                fab.setImageDrawable(ContextCompat.getDrawable(getApplicationContext(), iconIntArray[position]));
    
                // Rotate Animation
                Animation rotate = new RotateAnimation(60.0f, 0.0f,
                        Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
                        0.5f);
                rotate.setDuration(150);
                rotate.setInterpolator(new DecelerateInterpolator());
    
                // Scale up animation
                ScaleAnimation expand = new ScaleAnimation(0.1f, 1f, 0.1f, 1f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
                expand.setDuration(150);     // animation duration in milliseconds
                expand.setInterpolator(new DecelerateInterpolator());
    
                // Add both animations to animation state
                AnimationSet s = new AnimationSet(false); //false means don't share interpolators
                s.addAnimation(rotate);
                s.addAnimation(expand);
                fab.startAnimation(s);
            }
    
            @Override
            public void onAnimationRepeat(Animation animation) {
    
            }
        });
        fab.startAnimation(shrink);
    }