@Ksernik
я был не хуже других, но лучше многих...

Mini Navigation Drawer. Опыт использования *желательно без сторонних библиотек*?

День добрый =)
К сожалению дизайнеры и разработчики Google живут в разных вселенных, которые пересекаются далеко не всегда..
К примеру в дизайнерском гайдлайне есть интересный пример поведения называющийся Mini Navigation Drawer patterns_navdrawer_behavior_persistent4.
но сколько я ни бился, не могу найти даже намёка на гугловскую реализацию этой красоты в коде...
Вопрос.. кто нибудь использовал данное поведение в своих проектах? можете поделиться опытом реализации?
  • Вопрос задан
  • 777 просмотров
Пригласить эксперта
Ответы на вопрос 3
mbelskiy
@mbelskiy
Software Developer
Mini variant – это вариация persistent navigation drawer. А persistent не рекомендуется использовать в мобайле – Persistent navigation drawers are acceptable for all sizes larger than mobile. Persistent navigation drawers are not recommended for apps with multiple levels of hierarchy that require using an up arrow for navigation.
Ответ написан
@Ksernik Автор вопроса
я был не хуже других, но лучше многих...
Ладно.. выложу вариант- на котором остановился в данный момент.. пришлось раскуривать либу которую выложил Mike Penz.. *хотя в моём случае возможны головняки с AccountHeader, но к вопросу это не относится*

В любом случае, если у кого то имеется опыт иной реализации, прошу поделиться им

private AccountHeader headerResult = null;
    private Drawer result = null;
    private MiniDrawer miniResult = null;

    private Crossfader crossFader;

    private void setNavigationDrawer(Bundle savedInstanceState, Toolbar toolbar) {

        // Create a few sample profile
        // NOTE you have to define the loader logic too. See the CustomApplication for more details
        final IProfile profile = new ProfileDrawerItem()
                .withName("Mike Penz")
                .withEmail("mikepenz@gmail.com")
                .withIcon("https://avatars3.githubusercontent.com/u/1476232?v=3&s=460");

        // Create the AccountHeader
        headerResult = new AccountHeaderBuilder()
                .withActivity(this)
                .withSelectionListEnabledForSingleProfile(false)
                .withHeaderBackground(R.color.colorNavBackgroundColor)
                .withTextColorRes(R.color.colorBlackTextColor)
                .addProfiles(
                        profile
                )
                .withOnAccountHeaderListener(new AccountHeader.OnAccountHeaderListener() {
                    @Override
                    public boolean onProfileChanged(View view, IProfile profile, boolean current) {
                        miniResult.onProfileClick();
                        //false if you have not consumed the event and it should close the drawer
                        return false;
                    }
                })
                .withSavedInstance(savedInstanceState)
                .build();

        DrawerBuilder builder = new DrawerBuilder()
                .withActivity(this)
                .withToolbar(toolbar)
                .withSelectedItem(-1)
                .withAccountHeader(headerResult) //set the AccountHeader we created earlier for the header
                .addDrawerItems(
                        new PrimaryDrawerItem().withName(R.string.drawer_item_first).withIcon(R.drawable.nav_client_icon).withIdentifier(1),
                        new PrimaryDrawerItem().withName(R.string.drawer_item_third).withIcon(R.drawable.nav_event_icon).withIdentifier(2),
                        new PrimaryDrawerItem().withName(R.string.drawer_item_second).withIcon(R.drawable.nav_orders_icon).withIdentifier(3),
                        new DividerDrawerItem(),
                        new PrimaryDrawerItem().withName(R.string.drawer_item_fourth).withIcon(R.drawable.nav_settings_icon).withIdentifier(4),
                        new DividerDrawerItem(),
                        new PrimaryDrawerItem().withName(R.string.drawer_item_fifth).withIcon(R.drawable.nav_exit_icon).withIdentifier(5)


                ) // 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();

                        }
                        switch (position){
                            case 1:
                                showFragment(new ClientsFragment(),true,true, ClientsFragment.class.getSimpleName());

                                break;
                            case 2:
                                showFragment(new EventListFragment(),true,false, EventListFragment.class.getSimpleName());
                                showFragment(new EventDetailsFragment(),false,false, EventDetailsFragment.class.getSimpleName());
                                break;
                        }

                        miniResult.onItemClick(drawerItem);

                        return true;
                    }
                })
                .withSavedInstance(savedInstanceState);


        // build only the view of the Drawer (don't inflate it automatically in our layout which is done with .build())
        result = builder.buildView();

        // create the MiniDrawer and deinfe the drawer and header to be used (it will automatically use the items from them)
        miniResult = new MiniDrawer()
                .withDrawer(result)
                .withAccountHeader(headerResult);

        //IMPORTANT Crossfader specific implementation starts here (everything above is MaterialDrawer):

        //get the widths in px for the first and second panel
        int firstWidth = (int) UIUtils.convertDpToPixel(200, this);
        int secondWidth = (int) UIUtils.convertDpToPixel(72, this);

        //create and build our crossfader (see the MiniDrawer is also builded in here, as the build method returns the view to be used in the crossfader)
        crossFader = new Crossfader()
                .withContent(findViewById(R.id.linear_layout_container))
                .withFirst(result.getSlider(), firstWidth)
                .withSecond(miniResult.build(this), secondWidth)
                .withGmailStyleSwiping()
                .withSavedInstance(savedInstanceState)
                .build();

        //define the crossfader to be used with the miniDrawer. This is required to be able to automatically toggle open / close
        miniResult.withCrossFader(new CrossfadeWrapper(crossFader));

        //define a shadow (this is only for normal LTR layouts if you have a RTL app you need to define the other one
        crossFader.getCrossFadeSlidingPaneLayout().setShadowResourceLeft(R.drawable.material_drawer_shadow_left);

    }
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы