LoginSignup
19
26

More than 5 years have passed since last update.

Tool Bar (Action Bar) に icon, logo, up indicator などを表示する

Posted at

"Basic Activity"を使って新規にプロジェクトを作成した後、"Tool Bar"上にiconやup indicator などを表示する方法のメモです。

環境

"Windows 10 Pro (64bit)" 上の "Android Studio 2.2"で確認しています。

  • Android Studio

Android Studio 2.2.1
Build #AI-145,3330264, built on October 6, 2016

JRE: 1.8.0_76-release-b03 amd64
JVM: OpenJDK 64-Bit Server VM by JetBrains s.r.o

  • Create New Project の設定値

Target Android Devices
 Phone and Tablet
  Minimum SDK | API 15: Android 4.0.3 (IceCreamSandwich)

Add an Activity to Mobile
 Basic Activity

Basic Activity のデフォルトの Tool Bar (Action Bar) の表示

Screenshot_1476801255.png

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

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

        // 以下省略
    }
  • Tool Bar が Action Bar として振る舞う設定が有効になっている。

Tool Bar をそのまま使用する

Tool Bar に何も設定しなかった場合

Screenshot_1476804181.png

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

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

        // 以下省略
    }

Tool Bar にロゴとタイトルを設定した場合

Screenshot_1476804542.png

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

        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        toolbar.setTitle("Title");
        toolbar.setLogo(android.R.drawable.sym_def_app_icon);

        // 以下省略
    }

Tool Bar にナビゲーションアイコンを設定した場合

Screenshot_1476805157.png

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

        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        toolbar.setTitle("Title");
        toolbar.setNavigationIcon(android.R.drawable.sym_def_app_icon);
        toolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
                        .setAction("Action", null).show();
            }
        });

        // 以下省略
    }

Tool Bar を Action Bar として使用する

Tool Bar (Action Bar) の Up Indicator 表示を有効にした場合

Screenshot_1476801367.png

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

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

        // up indicator の表示を有効にする
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

        // 以下省略
    }

Tool Bar (Action Bar) に アイコン を設定した場合

Screenshot_1476802014.png

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

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

        // アイコンを表示する
        getSupportActionBar().setIcon(android.R.drawable.sym_def_app_icon);

        // 以下省略
    }
  • アイコンのサイズが大きさと、アイコンとタイトルとの間隔がいまいちでした。

Tool Bar (Action Bar) に ロゴ を設定した場合

Screenshot_1476802167.png

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

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

        // ロゴを表示する
        getSupportActionBar().setLogo(android.R.drawable.sym_def_app_icon);

        // 以下省略
    }
  • アイコンの表示と同様でした。

Tool Bar (Action Bar) に Up Indicator として画像を設定した場合

Screenshot_1476806099.png

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

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

        // Up Indicator として画像を表示する
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setHomeAsUpIndicator(android.R.drawable.sym_def_app_icon);

        // 以下省略
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();
        if (id == android.R.id.home) {
            Toast.makeText(MainActivity.this, "Replace with your own action", Toast.LENGTH_LONG).show();
            return true;
        }
        return super.onOptionsItemSelected(item);
    }
19
26
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
19
26