安卓:左侧菜单项

4
现在我有这个:

输入图片说明

但我想要做成这样:

输入图片说明

<?xml version="1.0" encoding="utf-8"?>

<item
    android:id="@+id/menu"
    android:icon="@drawable/ic_menu"
    android:title="@string/title_menu"
    app:showAsAction="always" />

<item
    android:id="@+id/file"
    android:icon="@drawable/ic_file"
    android:title="@string/title_file"
    app:showAsAction="always" />


<item
    android:id="@+id/new_file"
    android:icon="@drawable/ic_new_file"
    android:title="@string/title_new_file"
    app:showAsAction="always" />


<item
    android:id="@+id/visual"
    android:icon="@drawable/ic_eye"
    android:title="@string/title_eye"
    app:showAsAction="always" />


<item
    android:id="@+id/print"
    android:icon="@drawable/ic_print"
    android:title="@string/title_print"
    app:showAsAction="always" />

<item android:id="@+id/help"
    android:icon="@drawable/ic_help"
    android:title="@string/title_help" />

我在活动中添加了这个菜单

    override fun onCreateOptionsMenu(menu: Menu): Boolean {
    val inflater = menuInflater
    inflater.inflate(R.menu.designer_options_menu, menu)
    return true
}

我不明白如何在左侧安装ic_menu。

用可视化的方式展示“我有什么”和“我想要什么”,这是一个非常好的做法,值得高分赞扬。:clap: - Joshua Pinter
2个回答

7
您可以在CoordinatorLayout中使用自定义工具栏,通过使用Up/Home按钮来实现该功能:
1. 主布局
<android.support.design.widget.CoordinatorLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

        </android.support.v7.widget.Toolbar>

    </android.support.design.widget.AppBarLayout>

    <!-- My Layout -->
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello World!" />

    </LinearLayout>

</android.support.design.widget.CoordinatorLayout>

2. 您的菜单


<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/folder"
        android:icon="@drawable/ic_folder_black_24dp"
        android:orderInCategory="1"
        android:title=""
        app:showAsAction="always" />

    <item
        android:id="@+id/file"
        android:icon="@drawable/ic_insert_drive_file_black_24dp"
        android:orderInCategory="2"
        android:title=""
        app:showAsAction="always" />

    <item
        android:id="@+id/eye"
        android:icon="@drawable/ic_remove_red_eye_black_24dp"
        android:orderInCategory="3"
        android:title=""
        app:showAsAction="always" />

    <item
        android:id="@+id/print"
        android:icon="@drawable/ic_print_black_24dp"
        android:orderInCategory="4"
        android:title=""
        app:showAsAction="always" />

</menu>

3. Java

public class MainActivity extends AppCompatActivity {

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

        Toolbar toolbar = findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);

        if (getSupportActionBar() != null) {
            getSupportActionBar().setDisplayHomeAsUpEnabled(true);
            getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_menu_black_24dp);
            getSupportActionBar().setTitle("");
        }
    }


    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()) {
            case android.R.id.home:
                Toast.makeText(this, "Home", Toast.LENGTH_SHORT).show();
                break;
            case R.id.eye:
                Toast.makeText(this, "Eye", Toast.LENGTH_SHORT).show();
                break;
            case R.id.file:
                Toast.makeText(this, "File", Toast.LENGTH_SHORT).show();
                break;
            case R.id.folder:
                Toast.makeText(this, "Folder", Toast.LENGTH_SHORT).show();
                break;
            case R.id.print:
                Toast.makeText(this, "Print", Toast.LENGTH_SHORT).show();
                break;
        }
        return super.onOptionsItemSelected(item);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.menu, menu);
        return true;
    }
}

4. 样式: 使用 NoActionBar 主题

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

</resources>

5. Gradle::为协调布局添加设计支持库

implementation 'com.android.support:design:28.0.0'
结果

enter image description here


3

更简单的版本

  1. Add android:icon to your Main Activity or whatever Activity you want this icon:

    <activity
      android:name=".Main"
      android:icon="@drawable/ic_settings_white_24dp"
      android:launchMode="singleTop">
    
  2. Enable the "home" icon in your Main.java:

    getActionBar().setDisplayShowHomeEnabled( true ); // In your onCreate() or wherever.
    
  3. You might also want to hide the back icon in the top left and the app name in the top left. You can do that with these two commands:

    // Disable back icon in top left and hide app name.
    getActionBar().setDisplayHomeAsUpEnabled( false );
    getActionBar().setDisplayShowTitleEnabled( false );
    
  4. To handle the click event you just need to capture the home in onOptionsItemSelected:

    @Override
    public boolean onOptionsItemSelected( MenuItem item ) {
    
      switch( item.getItemId() ) {
    
        case android.R.id.home:
          // Do something.
    
          return true;
    
      }
    }
    

对我们有用,最终的结果类似于这样:

CNTRAL Mobile™ 截图

使用 AppCompatActivity

如果您的Activity继承自AppCompatActivity,则需要稍微不同的操作。以下是上述步骤的更改:

  1. No need to add android:icon to AndroidManifest.xml.

  2. Set the Icon to use in your Main.java Activity and use getSupportActionBar():

    getSupportActionBar().setHomeAsUpIndicator( R.drawable.ic_settings_white_24dp );
    

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接