Program Tip

오른쪽에 카운터가있는 NavigationView 메뉴 항목

programtip 2020. 11. 23. 19:54
반응형

오른쪽에 카운터가있는 NavigationView 메뉴 항목


새로운 디자인 지원 라이브러리 의 새로운 NavigationView 는 정말 훌륭하게 작동합니다.

" 메뉴 항목 "을 사용하여 옵션을 표시합니다.

그러나 메뉴 항목 오른쪽카운터표시 하려면 어떻게해야합니까?

이 그림에서와 같이 :

여기에 이미지 설명 입력

또는 GMail에서처럼 .


appcompat-v7 버전 23부터는 NavigationView액션 뷰를 지원하므로 카운터를 직접 구현하는 것이 매우 쉽습니다.

  1. 카운터 레이아웃 생성 menu_counter.xml:

    <?xml version="1.0" encoding="utf-8"?>
    <TextView xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center_vertical"
        android:textAppearance="@style/TextAppearance.AppCompat.Body2" />
    
  2. 서랍 메뉴 xml에서 참조하십시오 menu/drawer.xml.

    <item
        ...
        app:actionLayout="@layout/menu_counter" />
    

참고가 사용할 필요가 app네임 스페이스를 사용하려고하지 않습니다 android.

또는 MenuItem.setActionView()방법 으로 작업보기를 수동으로 설정할 수 있습니다 .

  1. 메뉴 항목 찾기 및 카운터 설정 :

    private void setMenuCounter(@IdRes int itemId, int count) {
        TextView view = (TextView) navigationView.getMenu().findItem(itemId).getActionView();
        view.setText(count > 0 ? String.valueOf(count) : null);
    }
    

Android 2.x 버전을 지원해야하는 경우 MenuItemCompat 를 사용해야 합니다 .


내 해결 방법은 MenuItem의 새 제목과 다른 배경을 가진 SpannableString을 전달하는 것이 었습니다.

나는 그것이 최선의 해결책이 아니라는 것을 알고 있고 오른쪽으로 정렬되어 있지는 않지만 카운터로 잘 작동합니다. 이 같은:

NavigationView navigation = (NavigationView)findViewById(R.id.navigation);
Menu menuNav = navigation.getMenu();
MenuItem element = menuNav.findItem(R.id.item5);
String before = element.getTitle().toString();

String counter = Integer.toString(5);
String s = before + "   "+counter+" ";
SpannableString sColored = new SpannableString( s );

sColored.setSpan(new BackgroundColorSpan( Color.GRAY ), s.length()-(counter.length()+2), s.length(), 0);
sColored.setSpan(new ForegroundColorSpan( Color.WHITE ), s.length()-(counter.length()+2), s.length(), 0);


element.setTitle(sColored);

카운터를 개선하기 위해 여기 에서 모서리를 둥글게 설정하는 좋은 답변을 찾을 수 있습니다.

예:

여기에 이미지 설명 입력


의 소스를 보면 NavigationView현재 메뉴 항목의 사용자 정의 렌더링을 지원하지 않습니다 ( NavigationMenuPresenter참조 NavigationMenuAdapter). 메뉴 항목에 사용자 정의 글꼴을 설정하고 싶지만 리플렉션을 사용하지 않고는 할 수없는 즉시 더 많은 기능을 제공하기를 바랍니다.


1 단계 : 그룹 항목을 식별하고 아래와 같이 "app : actionViewClass = android.widget.TextView"를 추가합니다.

<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">

<group android:checkableBehavior="single">

    <item
        android:id="@+id/nav_recorder"
        app:actionViewClass="android.widget.TextView"
        android:icon="@drawable/ic_menu_gallery"
        android:title="Gallery" />
    <item
        android:id="@+id/nav_night_section"
        app:actionViewClass="android.widget.TextView"
        android:icon="@drawable/ic_menu_slideshow"
        android:title="Slideshow" />
</group>

2 단계 : 탐색 창 메뉴 항목을 선언하고 배지 값으로 항목 초기화

//Create these objects above OnCreate()of your main activity
TextView recorder,nightSection;

//These lines should be added in the OnCreate() of your main activity
recorder =(TextView) MenuItemCompat.getActionView(navigationView.getMenu().
        findItem(R.id.nav_recorder));

recordSection=(TextView) MenuItemCompat.getActionView(navigationView.getMenu().
        findItem(R.id.nav_night_section));

//This method will initialize the count value
initializeCountDrawer();

3 단계 : initializeCountDrawer ()는 필요한 곳에서 호출 할 수 있습니다. 탐색 창 메뉴 항목에서 개수 또는 배지 값을 업데이트하는 데 사용할 수도 있습니다.

private void initializeCountDrawer(){

    //Gravity property aligns the text
    recorder.setGravity(Gravity.CENTER_VERTICAL);
    recorder.setTypeface(null, Typeface.BOLD);
    recorder.setTextColor(getResources().getColor(R.color.colorAccent));                
    recorder.setText("99+");

    slideshow.setGravity(Gravity.CENTER_VERTICAL);
    slideshow.setTypeface(null,Typeface.BOLD);
    slideshow.setTextColor(getResources().getColor(R.color.colorAccent));              
    //count is added     
   slideshow.setText("7");
}

그렇게 할 수있는 훌륭한 라이브러리가 있습니다-https: //github.com/mikepenz/MaterialDrawer .

참고 URL : https://stackoverflow.com/questions/30560663/navigationview-menu-items-with-counter-on-the-right

반응형