web-dev-qa-db-ja.com

ツールバーに戻る矢印を表示

私は自分のアプリケーションでActionBarからToolbarに移行しています。しかし、私はToolbarで行ったようにActionbarの上矢印でクリックイベントを表示および設定する方法を知りません。

enter image description here

ActionBarでは、mActionbar.setDisplayHomeAsUpEnabled(true)と呼びます。しかし、このような類似の方法はありません。

誰かがこの状況に直面したことがあり、どういうわけかそれを解決する方法を見つけましたか?

416
Huy Duong Tu

ActionBarActivityを使用している場合は、AndroidにToolbarActionBarとして使用するように指示できます。

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

そしてを呼び出す

getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);

働くでしょう。 ActionBarActivitiesにアタッチされているFragmentsでは、このように使うこともできます。

((ActionBarActivity) getActivity()).getSupportActionBar().setDisplayHomeAsUpEnabled(true);
((ActionBarActivity) getActivity()).getSupportActionBar().setDisplayShowHomeEnabled(true);

ActionBarActivitiesを使用していない場合、または自分のToolbarとして設定されていないSupportActionBarの上向き矢印を取得する場合は、次のようにします。

mActionBar.setNavigationIcon(getResources().getDrawable(R.drawable.ic_action_back));
mActionBar.setNavigationOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View v) {
       //What to do on back clicked
   }
});

Android.support.v7.widget.Toolbarを使用している場合は、AppCompatActivityに次のコードを追加してください。

@Override
public boolean onSupportNavigateUp() {
    onBackPressed();
    return true;
}
764
MrEngineer13

私は多くの答えを見ていますが、ここではこれまでに述べられていない私のものです。 API 8以降で動作します。

public class DetailActivity extends AppCompatActivity

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

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

    // add back arrow to toolbar
    if (getSupportActionBar() != null){
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setDisplayShowHomeEnabled(true);
    }
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    // handle arrow click here
    if (item.getItemId() == Android.R.id.home) {
        finish(); // close this activity and return to preview activity (if there is any)
    }

    return super.onOptionsItemSelected(item);
}
188
Vasil Valchev

それを実現するには多くの方法があります。ここが私のお気に入りです。

レイアウト:

<Android.support.v7.widget.Toolbar
    Android:id="@+id/toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="?attr/actionBarSize"
    app:navigationIcon="?attr/homeAsUpIndicator" />

アクティビティ:

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

    toolbar.setNavigationOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            // back button pressed
        }
    });
134
Igor Bubelov

ツールバーのsetNavigationIconメソッドを使用できます。 Android Doc

mToolBar.setNavigationIcon(R.drawable.abc_ic_ab_back_mtrl_am_alpha);

mToolBar.setNavigationOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        handleOnBackPress();
    }
});
70
Sam

カスタムのToolbarを作成したくない場合は、次のようにします。

public class GalleryActivity extends AppCompatActivity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        ...  
        getSupportActionBar().setTitle("Select Image");
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setDisplayShowHomeEnabled(true);
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        if (item.getItemId() == Android.R.id.home) {
            finish();
        }
return super.onOptionsItemSelected(item);
    }
}

あなたの中にAndroidManifest.xml

<activity
    Android:name=".GalleryActivity"
    Android:theme="@style/Theme.AppCompat.Light"
    >        
</activity>

すべてのアクティビティに適用するために、このAndroid:theme="@style/Theme.AppCompat.Light"<aplication>タグに入れることもできます。

enter image description here

16
Phan Van Linh
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    toolbar.setNavigationIcon(R.drawable.back_arrow); // your drawable
    toolbar.setNavigationOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            onBackPressed(); // Implemented by activity
        }
    });

そしてAPI 21+の場合Android:navigationIcon

<Android.support.v7.widget.Toolbar
    Android:navigationIcon="@drawable/back_arrow"
    Android:layout_width="match_parent"
    Android:layout_height="?attr/actionBarSize"/>
16
Ilya Gazman

私は Google Developer Documentation からこの方法を使いました。

@Override
public void onCreate(Bundle savedInstanceState) {
  ...
  getActionBar().setDisplayHomeAsUpEnabled(true);
}

Nullポインタ例外が発生した場合は、テーマによって異なります。マニフェストで別のテーマを使用するか、これを代わりに使用してください。

@Override
public void onCreate(Bundle savedInstanceState) {
  ...
  getSupportActionBar().setDisplayHomeAsUpEnabled(true);
}

それからマニフェストの中で、私は現在のアクティビティに親アクティビティを設定します。

<activity
        Android:name="com.example.myapp.MyCurrentActivity"
        Android:label="@string/title_activity_display_message"
     Android:parentActivityName="com.example.myfirstapp.MainActivity" >
    <!-- Parent activity meta-data to support 4.0 and lower -->
    <meta-data
        Android:name="Android.support.PARENT_ACTIVITY"
        Android:value="com.example.myapp.MyMainActivity" />
</activity>

これがお役に立てば幸いです。

15
Paolo Anghileri

wereを使用してAppCompatActivityname__を使用し、使用しないパスを下った場合、それが提供する自動ActionBarname__を取得したくないので、マテリアルデザインのためにToolbarname__を分離したいのでニーズとCoordinatorLayoutname__またはAppBarLayoutname__、その後、これを考慮してください:

AppCompatActivityname__を引き続き使用できます。xmlで<Android.support.v7.widget.Toolbar>を使用できるようにするために、使用を停止する必要はありません。次のように、アクションバーstyleをオフにします。

まず、styles.xmlで好きなNoActionBarテーマの1つからスタイルを導出します。私はTheme.AppCompat.Light.NoActionBarを次のように使用しました。

<style name="SuperCoolAppBarActivity" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/primary</item>

    <!-- colorPrimaryDark is used for the status bar -->
    <item name="colorPrimaryDark">@color/primary_dark</item>
    ...
    ...
</style>

アプリのマニフェストで、次のように定義した子スタイルテーマを選択します。

    <activity
        Android:name=".activity.YourSuperCoolActivity"
        Android:label="@string/super_cool"
        Android:theme="@style/SuperCoolAppBarActivity">
    </activity>

アクティビティXmlで、ツールバーが次のように定義されている場合:

...
    <Android.support.v7.widget.Toolbar
        Android:id="@+id/toolbar"
        Android:layout_width="match_parent"
        Android:layout_height="?attr/actionBarSize"
        />
...

次に、これが重要な部分です。set拡張するAppCompatActivityへのサポートアクションバーを使用すると、xmlのツールバーになりますアクションバー。カスタムクリックハンドラーなどを追加せずに、メニュー、自動アクティビティタイトル、アイテム選択処理など、ActionBarで許可される多くのことを簡単に実行できるため、これはより良い方法だと思います。

アクティビティのonCreateオーバーライドで、次を実行します。

@Override
protected void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_super_cool);
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

    setSupportActionBar(toolbar);
    //Your toolbar is now an action bar and you can use it like you always do, for example:
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);
} 
12
Dhiraj Gupta
MyActivity extends AppCompatActivity {

    private Toolbar toolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        ...
        toolbar = (Toolbar) findViewById(R.id.my_toolbar);
        setSupportActionBar(toolbar);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        toolbar.setNavigationOnClickListener(arrow -> onBackPressed());
    }
7
Artemiy

ツールバーに戻るボタンを表示する簡単で簡単な方法

このコードをonCreateメソッドに貼り付けます

 if (getSupportActionBar() != null){

            getSupportActionBar().setDisplayHomeAsUpEnabled(true);
            getSupportActionBar().setDisplayShowHomeEnabled(true);
        }

このオーバーライドメソッドをonCreateメソッドの外側に貼り付けます

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    if(item.getItemId()== Android.R.id.home) {

        finish();
    }
    return super.onOptionsItemSelected(item);
}
6
Waheed Sabir

例えばAppCompatActivityでは、次のことができます。

public class GrandStatActivity extends AppCompatActivity {

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

    @Override
    public void onResume() {
        super.onResume();

        // Display custom title
        ActionBar actionBar = this.getSupportActionBar();
        actionBar.setTitle(R.string.fragment_title_grandstats);

        // Display the back arrow
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setDisplayShowHomeEnabled(true);
    }

    // Back arrow click event to go to the parent Activity
    @Override
    public boolean onSupportNavigateUp() {
        onBackPressed();
        return true;
    }

}
5
Developer

簡単にできます。

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

getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);
@Override
public boolean onSupportNavigateUp() {
    onBackPressed();
    return true;
}

クレジット: https://freakycoder.com/Android-notes-24-how-to-add-back-button-at-toolbar-941e6577418e

5
Euler Tiago

戻るボタンを追加するアクティビティのマニフェストファイルでは、プロパティ{Android:parentActivityNameを使用します。

        <activity
        Android:name=".WebActivity"
        Android:screenOrientation="portrait"
        Android:parentActivityName=".MainActivity"
        />

P.S この属性は、APIレベル16で導入されました。

3

これはうまくいった

public class BackButton extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.chat_box);
        Toolbar chatbox_toolbar=(Toolbar)findViewById(R.id.chat_box_toolbar);
        chatbox_toolbar.setTitle("Demo Back Button");
        chatbox_toolbar.setTitleTextColor(getResources().getColor(R.color.white));
        setSupportActionBar(chatbox_toolbar);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setDisplayShowHomeEnabled(true);
        chatbox_toolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                //Define Back Button Function
            }
        });
    }
}
3
Vikash Sharma

コトリンでは

private fun setupToolbar(){
    toolbar.title = getString(R.string.YOUR_TITLE)
    setSupportActionBar(toolbar)
    supportActionBar?.setDisplayHomeAsUpEnabled(true)
    supportActionBar?.setDisplayShowHomeEnabled(true)
}

// don't forget click listener for back button
override fun onSupportNavigateUp(): Boolean {
    onBackPressed()
    return true
}
3
gprathour

これをレイアウトフォルダ内のアクティビティのxmlに追加します。

<Android.support.design.widget.AppBarLayout
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:theme="@style/AppTheme.AppBarOverlay">
    <Android.support.v7.widget.Toolbar
        Android:id="@+id/prod_toolbar"
        Android:layout_width="match_parent"
        Android:layout_height="?attr/actionBarSize"
        Android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay" />
</Android.support.design.widget.AppBarLayout>

ツールバーをクリック可能にするには、これらをonCreateメソッドに追加します。

Toolbar toolbar = (Toolbar) findViewById(R.id.prod_toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        finish();
    }
});
1
Yang

DrawerLayout ActionBarDrawerToggle と使用している場合は、 Menu button(およびその逆)の代わりに Back buttonを表示するには、追加する必要があります。あなたの活動の中でこのコード:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    // ...

    mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
    mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, toolbar, R.string.application_name, R.string.application_name);
    mDrawerLayout.addDrawerListener(mDrawerToggle);

    mDrawerToggle.setHomeAsUpIndicator(R.drawable.ic_arrow_back_white_32dp);
    mDrawerToggle.setToolbarNavigationClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            onBackPressed(); // Or you can perform some other action here when Back button is clicked.
        }
    });
    mDrawerToggle.syncState();
    // ...
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    if (mDrawerToggle.onOptionsItemSelected(item))
        return true;

    switch (item.getItemId()) {
        case Android.R.id.home:
            onBackPressed();
            return true;
        // ...
    }

    return super.onOptionsItemSelected(item);
}

public void showBackInToolbar(boolean isBack) {
    // Remove next line if you still want to be able to swipe to show drawer menu.
    mDrawerLayout.setDrawerLockMode(isBack ? DrawerLayout.LOCK_MODE_LOCKED_CLOSED : DrawerLayout.LOCK_MODE_UNLOCKED);
    mDrawerToggle.setDrawerIndicatorEnabled(!isBack);
    mDrawerToggle.syncState();
}

したがって、 Menu buttonの代わりに Back buttonを表示する必要がある場合は、 showBackInToolbar(true) を呼び出し、 Menu buttonが必要な場合は、 showBackInToolbar(false) を呼び出します。

あなたは逆矢印(ic_arrow_back_white_32dp)を生成することができます ここで Clipart セクションでarrow_backを検索してください(8dpパディングでデフォルトの32dpを使用してください)。希望の色を選択するだけです。

0
Borzh

あなたはいつでもあなたのToolbarRelative layoutまたはLinear Layoutを追加することができ、あなたが好きなように戻るアイコンまたは閉じるアイコンのためのImageビューをツールバーのどこにでも置くことができます

たとえば、私は自分のツールバーで相対レイアウトを使用しました

 <Android.support.v7.widget.Toolbar
                Android:id="@+id/toolbar_top"
                Android:layout_width="match_parent"
                Android:layout_height="35dp"
                Android:minHeight="?attr/actionBarSize"
                Android:nextFocusDown="@id/netflixVideoGridView"
                app:layout_collapseMode="pin">

                <RelativeLayout
                    Android:layout_width="match_parent"
                    Android:layout_height="wrap_content">


                    <TextView

                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:text="Myflix"
                        Android:textAllCaps="true"
                        Android:textSize="19sp"
                        Android:textColor="@color/red"
                        Android:textStyle="bold" />


                    <ImageView
                        Android:id="@+id/closeMyFlix"
                        Android:layout_alignParentRight="true"
                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:layout_gravity="center_vertical"
                        app:srcCompat="@drawable/vector_close" />


                </RelativeLayout>

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

そしてそれはこのようになります:

enter image description here

Activityまたはフラグメントからこの画像ビューにクリックリスナーを追加できます。

  closeMyFlix.setOnClickListener({
            Navigator.instance.showFireTV(  activity!!.supportFragmentManager)
        })
0
Hitesh Sahu

Kotlinではそれは次のようになりました:Xml:

<include Android:id="@+id/tbSignToolbar " layout="@layout/toolbar_sign_up_in"/>

あなたの活動の中で:

setSupportActionBar(tbSignToolbar as Toolbar?)//tbSignToolbar :id of your toolbar supportActionBar?.setDisplayHomeAsUpEnabled(true) supportActionBar?.setDisplayShowHomeEnabled(true)

0
wissem miled

SupportActionBarとして設定されていないツールバーで戻る矢印を取得する場合:

(コトリン)

val resId = getResIdFromAttribute(toolbar.context, Android.R.attr.homeAsUpIndicator)
toolbarFilter.navigationIcon = ContextCompat.getDrawable(toolbar.context, resId)
toolbarFilter.setNavigationOnClickListener { fragmentManager?.popBackStack() }

属性から解像度を取得するには:

@AnyRes
fun getResIdFromAttribute(context: Context, @AttrRes attr: Int): Int {
    if (attr == 0) return 0
    val typedValueAttr = TypedValue()
    context.theme.resolveAttribute(attr, typedValueAttr, true)
    return typedValueAttr.resourceId
}
0
John