Android Material Design on new project in Android Studio

Question

I have build some Android app with Eclipse, now I'm start to use Android Studio for development

I have follow this Build a Material Design App Tutorial

I successfully run this tutorial on Android Studio using import, and works perfectly in device

So, I have fresh install latest Android Studio, download the latest sdk also

Now, I want to implement it in my app

Step that I have tried

1. Create new project

2. copy all activities in tutorial to my app

3. copy all rest folder in tutorial to my app

4. copy application setting in android manifest in tutorial to my app

5. copy build.gradle(module app) in tutorial to my app

But it shows error, then I start to trace what the problem, and found something

    import android.os.Bundle;
    import android.support.design.widget.FloatingActionButton;
    import android.support.design.widget.NavigationView;
    import android.support.design.widget.Snackbar;
    import android.support.design.widget.TabLayout;
    import android.support.graphics.drawable.VectorDrawableCompat;
    import android.support.v4.app.Fragment;
    import android.support.v4.app.FragmentManager;
    import android.support.v4.app.FragmentPagerAdapter;
    import android.support.v4.content.res.ResourcesCompat;
    import android.support.v4.view.GravityCompat;
    import android.support.v4.view.ViewPager;
    import android.support.v4.widget.DrawerLayout;
    import android.support.v7.app.ActionBar;
    import android.support.v7.app.AppCompatActivity;
    import android.support.v7.widget.Toolbar;
    import android.view.Menu;
    import android.view.MenuItem;
    import android.view.View;

    import java.util.ArrayList;
    import java.util.List;


    /**
     * Provides UI for the main screen.
     */
    public class MainActivity extends AppCompatActivity {

        private DrawerLayout mDrawerLayout;

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

            // Adding Toolbar to Main screen
            Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
            setSupportActionBar(toolbar);
            // Setting ViewPager for each Tabs
            ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
            setupViewPager(viewPager);
            // Set Tabs inside Toolbar
            TabLayout tabs = (TabLayout) findViewById(R.id.tabs);
            tabs.setupWithViewPager(viewPager);


            // Create Navigation drawer and inlfate layout
            NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
            mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer);
            // Adding menu icon to Toolbar
            ActionBar supportActionBar = getSupportActionBar();

            if (supportActionBar != null) {

                // Start from this line, if I leave it uncommented, it will make the app crash

                //VectorDrawableCompat indicator
                //      = VectorDrawableCompat.create(getResources(), R.drawable.ic_menu, getTheme());
                //indicator.setTint(ResourcesCompat.getColor(getResources(),R.color.white,getTheme()));
                //supportActionBar.setHomeAsUpIndicator(indicator);
                //supportActionBar.setDisplayHomeAsUpEnabled(true);
            }



            // Set behavior of Navigation drawer
            navigationView.setNavigationItemSelectedListener(
                    new NavigationView.OnNavigationItemSelectedListener() {
                        // This method will trigger on item Click of navigation menu
                        @Override
                        public boolean onNavigationItemSelected(MenuItem menuItem) {
                            // Set item in checked state
                            menuItem.setChecked(true);

                            // TODO: handle navigation

                            // Closing drawer on item click
                            mDrawerLayout.closeDrawers();
                            return true;
                        }
                    });
            // Adding Floating Action Button to bottom right of main view
            FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
            fab.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Snackbar.make(v, "Hello Snackbar!",
                            Snackbar.LENGTH_LONG).show();
                }
            });             
        }


        // Add Fragments to Tabs
        private void setupViewPager(ViewPager viewPager) {
            Adapter adapter = new Adapter(getSupportFragmentManager());
            adapter.addFragment(new ListContentFragment(), "List");
            adapter.addFragment(new TileContentFragment(), "Tile");
            adapter.addFragment(new CardContentFragment(), "Card");
            viewPager.setAdapter(adapter);
        }

        static class Adapter extends FragmentPagerAdapter {
            private final List<Fragment> mFragmentList = new ArrayList<>();
            private final List<String> mFragmentTitleList = new ArrayList<>();

            public Adapter(FragmentManager manager) {
                super(manager);
            }

            @Override
            public Fragment getItem(int position) {
                return mFragmentList.get(position);
            }

            @Override
            public int getCount() {
                return mFragmentList.size();
            }

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

            @Override
            public CharSequence getPageTitle(int position) {
                return mFragmentTitleList.get(position);
            }
        }

        @Override
        public boolean onCreateOptionsMenu(Menu menu) {
            // Inflate the menu; this adds items to the action bar if it is present.
            getMenuInflater().inflate(R.menu.menu_main, menu);
            return true;
        }

        @Override
        public boolean onOptionsItemSelected(MenuItem item) {
            // Handle action bar item clicks here. The action bar will
            // automatically handle clicks on the Home/Up button, so long
            // as you specify a parent activity in AndroidManifest.xml.
            int id = item.getItemId();
            //noinspection SimplifiableIfStatement
            if (id == R.id.action_settings) {
                return true;
            } else if (id == android.R.id.home) {
                mDrawerLayout.openDrawer(GravityCompat.START);
            }
            return super.onOptionsItemSelected(item);
        }

    }

I have commented some piece of code in above source code, and the app works well on device

if I activate that code, error will show like this

    E/AndroidRuntime: FATAL EXCEPTION: main
  java.lang.RuntimeException: Unable to start activity ComponentInfo{package.name.MainActivity}: android.content.res.Resources$NotFoundException: File res/drawable-mdpi-v4/ic_menu.png from xml type xml resource ID #0x7f02005e

the code which make the problem, start from this

    **//VectorDrawableCompat indicator
    //  = VectorDrawableCompat.create(getResources(), R.drawable.ic_menu, getTheme());**

if I leave it uncommented, it will make the app crash

So far, NavigationView, FloatingActionButton, etc. works well

So, what the problem with VectorDrawableCompat, and how to fixed it?

Thanks before

Answer 1

Install SDK platform of Android 5.0 SDK then update your Support Library and Support Repository to the latest version via the SDK-Manager.

Take a look at this link for creating material app

http://developer.android.com/training/material/index.html

With support libraries, you can provide similar behaviour on older devices like:

Using the Material Theme Subset of UI widgets like EditText Spinner RadioButton Also take a look at android design support library.

More information : More libraries available here

https://android-arsenal.com/

Answer 2

The answer is so simple, the problem is theme

    VectorDrawableCompat indicator = VectorDrawableCompat.create(getResources(), R.drawable.ic_menu, null);
    indicator.setTint(ResourcesCompat.getColor(getResources(),R.color.white, null));
    supportActionBar.setHomeAsUpIndicator(indicator);
    supportActionBar.setDisplayHomeAsUpEnabled(true);

I set theme with null value and now it works