Vista de navegación del diseño de materiales

NavigationView (vista de navegación) tiene dos partes, la cabeza puede cargar un diseño, la barra de menú puede cargar un archivo de menú. Generalmente utilizado en DrawerLayout. NavigationView es proporcionado por la biblioteca Design Support, primero agrega bibliotecas dependientes.

    compile 'com.android.support:design:24.2.1'
    compile 'de.hdodenhof:circleimageview:2.1.0'

Aquí se agregan dos bibliotecas de dependencias, la primera es la biblioteca de soporte de diseño y la segunda es un control de código abierto, que se utiliza para mostrar la imagen en forma circular;

A continuación, escriba un archivo de menú y un archivo de diseño de encabezado para cargar el encabezado y la barra de menú de NavigationView.

<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <group android:checkableBehavior="single">
        <item
            android:id="@+id/call"
            android:icon="@drawable/nav_call"
            android:title="电话"
            />
        <item
            android:id="@+id/friends"
            android:icon="@drawable/nav_friends"
            android:title="好友"
            />
        <item
            android:id="@+id/location"
            android:icon="@drawable/nav_location"
            android:title="位置"
            />
        <item
            android:id="@+id/mail"
            android:icon="@drawable/nav_mail"
            android:title="邮件"
            />
    </group>
</menu>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="180dp"
    android:background="?attr/colorPrimary"
    android:padding="10dp">

    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/circleImageView"
        android:layout_width="70dp"
        android:layout_height="70dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="33dp"
        android:src="@drawable/mn" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/circleImageView"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="13dp"
        android:text="我在等待,一个有你的未来!"
        android:textColor="#fff"
        android:textSize="12sp" />

</RelativeLayout>

En el archivo de menú, primero escriba un grupo, y el grupo de configuración solo puede seleccionarse. Un CircleImageView (la imagen se modifica en un círculo) y un TextView se colocan en el archivo de diseño.

Agregue el control NavigationView en el archivo de diseño principal:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.administrator.navigtionviewtest1.MainActivity">

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:headerLayout="@layout/nav_header"
        app:menu="@menu/nav_menu"></android.support.design.widget.NavigationView>
</RelativeLayout>

app: headerLayout = ”@ layout / nav_header” carga la vista de encabezado
app: menu = ”@ menu / nav_menu” carga las opciones del menú

Tenga en cuenta que xmlns: app = "http://schemas.android.com/apk/res-auto" agrega un nuevo espacio de nombres

A continuación, escriba eventos lógicos en el código:

public class MainActivity extends AppCompatActivity {

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

        NavigationView navigationView = (NavigationView) findViewById(R.id.navigation_view);
        navigationView.setCheckedItem(R.id.call);//设置默认选中项
        navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            //设置点击事件
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                Toast.makeText(MainActivity.this, "" + item.getTitle(), Toast.LENGTH_SHORT).show();
                return true;
            }
        });
    }
}

Escriba una descripción de la imagen aquí

Publicado 34 artículos originales · Me gusta 10 · Visitas 30,000+

Supongo que te gusta

Origin blog.csdn.net/q296264785/article/details/59484607
Recomendado
Clasificación