MaterialDrawer How to customize mini drawer

问题

I am trying to figured out how to customize MaterialDrawer by https://github.com/mikepenz/MaterialDrawer

At moment the width is too big. I want to make width smaller with bigger icons to cover the spaces and change the background color.

This App will be for tablet only. thanks.

Here is my drawer:

    <LinearLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/toolbar">
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <!-- Place your content here -->

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="New Button"
                android:id="@+id/button"
                android:layout_alignParentTop="true"
                android:layout_alignParentStart="true" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="New Button"
                android:id="@+id/button2"
                android:layout_alignParentBottom="true"
                android:layout_alignParentEnd="true"
                android:layout_marginBottom="215dp" />
        </RelativeLayout>
    </LinearLayout>


result = new DrawerBuilder()
                .withActivity(this)
                .addDrawerItems(
                        new PrimaryDrawerItem().withName("1").withIcon(FontAwesome.Icon.faw_home).withIdentifier(1),
                        new PrimaryDrawerItem().withName("2").withIcon(FontAwesome.Icon.faw_home).withBadge("22").withBadgeStyle(new BadgeStyle(Color.RED, Color.RED)).withIdentifier(2),
                        new PrimaryDrawerItem().withName("3").withIcon(FontAwesome.Icon.faw_home).withIdentifier(3)
                ) // add the items we want to use with our Drawer
                .withOnDrawerItemClickListener(new Drawer.OnDrawerItemClickListener() {
                    @Override
                    public boolean onItemClick(View view, int position, IDrawerItem drawerItem) {
                        if (drawerItem instanceof Nameable) {
                            Toast.makeText(MainActivity.this, ((Nameable) drawerItem).getName().getText(MainActivity.this), Toast.LENGTH_SHORT).show();
                        }
                        return false;
                    }
                })
                .withGenerateMiniDrawer(true)
                .withSavedInstance(savedInstanceState)
                // build only the view of the Drawer (don't inflate it automatically in our layout which is done with .build())
                .buildView();


        miniResult = result.getMiniDrawer();
        View view = miniResult.build(this);

        LinearLayout  container = (LinearLayout) findViewById(R.id.container);
        container.addView(view, 0); //view is the view of your MiniDrawer

Image:

I want to build something like this:

Thanks

I originally asked a question in how to enable a fixed mini drawer here Android build mini navigation drawer with Icons

回答1:

This answer is based on versions >= v5.3.5

First we have to define the width for the MiniDrawer itself. In the code samples shown below we will configure the MiniDrawer and it's item to take 144dp. I recommend to do this before adding the View to your layout as shown in this sample.

//get the MiniDrawer
MiniDrawer miniDrawer = result.getMiniDrawer();
//build it and get the view
View miniDrawerView = miniDrawer.build(this);
//define the width (You could also do it via the LayoutParams
miniDrawerView.setMinimumWidth((int) UIUtils.convertDpToPixel(144, this));
//add the MiniDrawer to your view hirachy
findViewById(R.id.frame_container)).addView(miniDrawerView, 0);

After you have added the MiniDrawer view itself to your layout you want to define the changed dimensions of the MiniDrawerItems you can do this via your dimens.xml file by defining the following:

<!-- required for a changed size -->
<!-- 144dp = the full width of the MiniDrawer -->
<dimen name="material_mini_drawer_item">144dp</dimen>
<!-- 144dp - 8dp padding around = 128dp -->
<dimen name="material_mini_drawer_item_icon">128dp</dimen>
<!-- 144dp - 16dp padding around = 112dp -->
<dimen name="material_mini_drawer_item_profile_icon">112dp</dimen>

<!-- optional configurable dimensions -->
<dimen name="material_mini_drawer_item_padding">4dp</dimen>
<dimen name="material_mini_drawer_item_padding_sides">8dp</dimen>
<dimen name="material_mini_drawer_item_icon_padding">16dp</dimen>
<dimen name="material_mini_drawer_item_badge_text">12sp</dimen>
<dimen name="material_mini_drawer_item_profile_icon_padding">16dp</dimen>

After this your MiniDrawer and the items will be displayed in the correct size.

来源：https://stackoverflow.com/questions/38346239/materialdrawer-how-to-customize-mini-drawer