Cách tùy chỉnh nút quay lại trên ActionBar


188

Tôi đã có thể tùy chỉnh nền, hình ảnh logo và màu văn bản của thanh hành động bằng cách sử dụng các đề xuất từ ​​những thứ sau:
Android: Làm cách nào để thay đổi Biểu tượng "Trang chủ" của ActionBar thành một biểu tượng khác ngoài biểu tượng ứng dụng?
Màu văn bản
ActionBar Ảnh nền ActionBar

Phần cuối cùng tôi muốn tùy chỉnh là hình ảnh nút quay lại. Theo mặc định, nó có màu xám và tôi muốn nó có màu trắng. Thay đổi màu sắc, chỉ định một hình vẽ có thể vẽ hoặc đơn giản là làm cho nó trong suốt (và thêm chevron vào hình ảnh logo tùy chỉnh của tôi) sẽ hoạt động. Làm thế nào để tôi đi về điều đó?


1
Không có nút BACK trên thanh hành động. Nút BACK nằm trên thanh hệ thống hoặc không có trên màn hình (đối với các thiết bị có nút BACK ngoài màn hình).
CommonsWare

1
@CommonsWare, tôi không chắc chắn 'chevron trái' trong thanh hành động được gọi là gì - nhưng đó là cái mà tôi đang gọi là nút quay lại. Tôi nghĩ rằng nó sẽ thay thế nút quay lại vật lý trên các thiết bị Android trong tương lai.
Sunil Gowda

13
Không và không. Đó là chỉ báo "lên" (mặc dù hướng mũi tên). Bạn kích hoạt nó thông qua setDisplayHomeAsUpEnabled()vào ActionBar. Nó đặc biệt KHÔNG được cho là chỉ đơn giản là "quay lại". Điều đó có nghĩa là việc chạm vào biểu tượng ứng dụng sẽ "tăng" cấu trúc phân cấp thay vì quay lại hoạt động trước đó (cũng như nút BACK trên thanh hệ thống).
CommonsWare

2
"Vậy những thiết bị mới không có nút quay lại vật lý thì sao, tất cả chúng đều hiển thị nút quay lại 'mềm'" - tất cả chúng đều có nút BACK trong thanh hệ thống.
CommonsWare

3
chỉ muốn thêm vào rất nhiều trường hợp, nút LÊN S W đơn giản quay trở lại. Xem "Khi màn hình được xem trước đó cũng là cha mẹ phân cấp của màn hình hiện tại, nhấn phím Quay lại sẽ có kết quả tương tự như nhấn nút Lên - đây là một sự cố phổ biến." Từ developer.android.com/design/potypes /navulation.html
Dori

Câu trả lời:


390

Chỉ báo khả năng chi trả "lên" được cung cấp bởi một drawable được chỉ định trong homeAsUpIndicatorthuộc tính của chủ đề. Để ghi đè nó bằng phiên bản tùy chỉnh của riêng bạn, nó sẽ giống như thế này:

<style name="Theme.MyFancyTheme" parent="android:Theme.Holo">
    <item name="android:homeAsUpIndicator">@drawable/my_fancy_up_indicator</item>
</style>

Nếu bạn đang hỗ trợ pre-3.0 với ứng dụng của mình, hãy chắc chắn rằng bạn đặt phiên bản chủ đề tùy chỉnh này trong values-v11hoặc tương tự.


10
làm việc cho tôi quá Tôi đã tuyên bố bên trong kiểu được đặt là ActionBarStyle của tôi như trong AOSP trên github nhưng nó không hoạt động - chuyển sang chủ đề chính đã thực hiện thủ thuật! +1
Dori

37
<item name="android:homeAsUpIndicator">@drawable/my_fancy_up_indicator</item>không làm việc cho tôi, nhưng <item name="homeAsUpIndicator">@drawable/my_fancy_up_indicator</item>đã làm. Đoán đây là phiên bản Android
Michał K

6
Có cách nào để đặt phần đệm trên và dưới cho phần này thành 0dp không?
James McCracken

3
@JamesMcCracken cách duy nhất tôi có thể làm điều này là thông qua một bố cục tùy chỉnh.
greg7gkb

4
Bất cứ ai đã làm việc này với Navigation Drawer? Tôi đoán ActionBarDrawerTogglethay thế chỉ báo lên bằng một chỉ báo riêng, do đó, đặt nó theo kiểu không có tác dụng ...
Lucas Jota

89

Vì vậy, bạn có thể thay đổi chương trình một cách dễ dàng bằng cách sử dụng hàm homeAsUpIndicator () được thêm vào trong API Android cấp 18 trở lên.

ActionBar().setHomeAsUpIndicator(R.drawable.ic_yourindicator);

Nếu bạn sử dụng thư viện hỗ trợ

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


5
Nếu bạn đang sử dụng ngăn kéo, bạn phải gọi drawerToggle.setDrawerIndicatorEnabled(false);trước khi thay đổi chỉ báo
Floss

2
@Floss Cảm ơn bạn, setDrawerTheicatorEnables (false / true); đã giải quyết vấn đề của tôi để đặt nút home là nhất quán 'Quay lại' và (Mở ngăn kéo / Đóng ngăn kéo) dựa trên yêu cầu của tôi.
Ashraf Alshahawy

1
@Floss ngăn kéoToggle.setDrawerTheicatorEnables (false); nó hoạt động với tôi :)
Bối cảnh

30

Tôi đã kiểm tra câu hỏi. Đây là các bước mà tôi làm theo. Mã nguồn được lưu trữ trên GitHub: https://github.com/jiahaoliuliu/sherlockActionBarLab

Ghi đè kiểu thực tế cho các thiết bị trước v11.

Sao chép và dán mã theo dõi trong tệp style.xml của thư mục giá trị mặc định.

<resources>
    <style name="MyCustomTheme" parent="Theme.Sherlock.Light">
    <item name="homeAsUpIndicator">@drawable/ic_home_up</item>
    </style>
</resources>

Lưu ý rằng cha mẹ có thể được thay đổi thành bất kỳ chủ đề Sherlock.

Ghi đè kiểu thực tế cho các thiết bị v11 +.

Trên cùng một thư mục chứa các giá trị thư mục, hãy tạo một thư mục mới gọi là value-v11. Android sẽ tự động tìm nội dung của thư mục này cho các thiết bị có API trở lên.

Tạo một tệp mới có tên là style.xml và dán mã theo dõi vào tệp:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="MyCustomTheme" parent="Theme.Sherlock.Light">
    <item name="android:homeAsUpIndicator">@drawable/ic_home_up</item>
    </style>
</resources>

Lưu ý rằng tên của kiểu phải giống với tệp trong thư mục giá trị mặc định và thay vì mục homeAsUpIndicator, nó được gọi là android: homeAsUpIndicator.

Vấn đề là vì đối với các thiết bị có API 11 trở lên, Sherlock Action Bar sử dụng Action Bar mặc định đi kèm với Android, tên khóa là android: homeAsUpIndicator. Nhưng đối với các thiết bị có API 10 trở xuống, Sherlock Action Bar sử dụng ActionBar của riêng nó, chỉ báo nhà ở dưới dạng gọi là "homeAsUpTheicator" đơn giản.

Sử dụng chủ đề mới trong bảng kê khai

Thay thế chủ đề cho ứng dụng / hoạt động trong tệp AndroidManifest:

<application
    android:allowBackup="true"
    android:icon="@drawable/ic_launcher"
    android:label="@string/app_name"
    android:theme="@style/MyCustomTheme" >

2
Và bạn có thể thử @ drawable / abc_ic_ab_back_holo_light hoặc @ drawable / abc_ic_ab_back_holo_dark nếu bạn đang tìm kiếm các biểu tượng holo đã có sẵn.
Mason Lee

25

Thay đổi biểu tượng điều hướng trở lại khác nhau cho ActionBar và Thanh công cụ.

Đối với homeAsUpIndicatorthuộc tính ghi đè ActionBar :

<style name="CustomThemeActionBar" parent="android:Theme.Holo">
    <item name="homeAsUpIndicator">@drawable/ic_nav_back</item>
</style>

Đối với navigationIconthuộc tính ghi đè Thanh công cụ :

<style name="CustomThemeToolbar" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="navigationIcon">@drawable/ic_nav_back</item>
</style>

19

Tôi đã làm mã dưới đây onCreate()và làm việc với tôi

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

5

Nếu bạn đang sử dụng Thanh công cụ, bạn không cần những giải pháp đó. Bạn chỉ phải thay đổi chủ đề của thanh công cụ

app:theme="@style/ThemeOverlay.AppCompat.Light"

app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"

Nếu bạn đang sử dụng dark.actionBar, nút quay lại của bạn sẽ có màu trắng khác nếu bạn đang sử dụng chủ đề thanh hành động nhẹ thì nó sẽ có màu đen.


Mã của bạn hoạt động với tôi, nhưng chúng ta có thể thay đổi màu của chỉ báo đó không?
Steve Luck

2
colorControlN normal và android: textColorSecondary giá trị chịu trách nhiệm cho điều đó nhưng tôi không chắc chắn những gì khác mà các giá trị này cũng thay đổi. Bạn có thể tự thử bằng cách xác định các giá trị này trên chủ đề thanh công cụ của bạn.
Oguz Ozcan

Tôi đang sử dụng "app: theme =" @ style / ThemeOverlay.AppCompat.Light "" để hiển thị navigationIcon ở chế độ nền trắng, nhưng nó hiển thị biểu tượng màu xám mặc định, tôi cần thay đổi nó thành màu xanh. "colorControlN normal và android: textColorSecondary" không hoạt động.
Steve Luck

2
Sử dụng một chủ đề tùy chỉnh có "ThemeOverlay.AppCompat.Light" làm phụ huynh. Điều này có thể làm việc.
Oguz Ozcan

1
Tôi đã tìm thấy giải pháp để thay đổi biểu tượng điều hướng, sử dụng name = "colorControlN normal" not name = "android: colorControlN normal". Nhưng tôi muốn thay đổi sang drawable khác, có thể?
Steve Luck

2

khay này:

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

bên trong onCreate();


Nó hoạt động nhưng làm thế nào để quay lại nút quay lại sớm hơn
Nadimuddin

0

Tôi đã sử dụng hình ảnh back.png trong tệp dự án menifest.xml. nó là tốt làm việc trong dự án.

<activity
        android:name=".YourActivity"
         android:icon="@drawable/back"
        android:label="@string/app_name" >
    </activity>

0

Tôi gặp vấn đề tương tự về hướng biểu tượng nút Home-bar, vì lỡ quản lý Biểu tượng trong biểu tượng thư mục Gradle Resource

giống như trong thư mục tài nguyên Gradle tiếng Ả Rập, bạn đặt biểu tượng trong x-hdpi và trong tiếng Anh Tài nguyên Gradle cùng tên biểu tượng bạn đặt trong thư mục mật độ khác nhau như xx-hdpi, do đó, trong APK sẽ có hai tên biểu tượng giống nhau trong các thư mục khác nhau, vì vậy thiết bị của bạn sẽ chọn biểu tượng phụ thuộc mật độ có thể là RTL hoặc LTR

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.