Como personalizar o botão Voltar no ActionBar


188

Consegui personalizar o plano de fundo, a imagem do logotipo e a cor do texto da barra de ação usando as sugestões
a seguir : Android: Como alterar o ícone "Página inicial" do ActionBar para algo diferente do ícone do aplicativo? Imagem de fundo do ActionBar
cor do texto
ActionBar

A última peça que quero personalizar é a imagem do botão Voltar. É cinza por padrão e eu gostaria que fosse branco. Mudar a cor, especificar um desenho ou simplesmente torná-lo transparente (e adicionar a divisa à minha imagem personalizada do logotipo) funcionaria. Como eu faço isso?


1
Não há botão VOLTAR na barra de ação. O botão VOLTAR está na barra do sistema ou não está na tela (para dispositivos com um botão VOLTAR fora da tela).
— CommonsWare

1
@ CommmonsWare, não sei ao que se chama a 'viga esquerda' na barra de ação - mas é a isso que estou me referindo como o botão Voltar. Eu acho que é esperado para substituir o botão voltar físico em dispositivos Android daqui para frente.
— Sunil Gowda

13
Não e não. Esse é o indicador "para cima" (apesar da orientação da seta). Você ativá-lo através setDisplayHomeAsUpEnabled()de ActionBar. NÃO é especificamente necessário simplesmente "voltar". Isso significa que tocar no ícone do aplicativo "subirá" uma hierarquia, em vez de voltar à atividade anterior (assim como o botão VOLTAR na barra do sistema).
— CommonsWare 13/02/12

2
"e os novos dispositivos que não possuem um botão de retorno físico, todos exibem um botão de retorno 'soft'" - todos devem ter um botão VOLTAR na barra do sistema.
— CommonsWare 13/02/12

3
só quero acrescentar em muitos casos o botão UP vai simplesmente voltar. Consulte "Quando a tela visualizada anteriormente também é o pai hierárquico da tela atual, pressionar a tecla Voltar terá o mesmo resultado que pressionar o botão Para cima - é uma ocorrência comum." Em developer.android.com/design/patterns /navigation.html
— Dori

Respostas:


390

O indicador de disponibilidade "up" é fornecido por um drawable especificado no homeAsUpIndicatoratributo do tema. Para substituí-lo por sua própria versão personalizada, seria algo como isto:

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

Se você suporta o pré-3.0 com seu aplicativo, certifique-se de colocar esta versão do tema personalizado em values-v11ou similar.


10
funciona para mim também. Eu estava declarando dentro do estilo definido como meu ActionBarStyle como no AOSP no github, mas não estava funcionando - sair para o tema principal fez o truque! +1
— Dori

37
<item name="android:homeAsUpIndicator">@drawable/my_fancy_up_indicator</item>não funcionou para mim, mas <item name="homeAsUpIndicator">@drawable/my_fancy_up_indicator</item>funcionou. Acho que é coisa versão Android
— Michał K

6
Existe alguma maneira de definir o preenchimento superior e inferior para 0dp?
— James McCracken

3
@JamesMcCracken a única maneira de fazer isso era através de um layout personalizado.
— Greg7gkb

4
Alguém fez esse trabalho Navigation Drawer? Eu acho que ActionBarDrawerTogglesubstitui o indicador para cima com um dos seus próprios, definindo-o, portanto, em estilo não tem nenhum efeito ...
— Lucas Jota

89

Portanto, você pode alterá-lo programaticamente facilmente usando a função homeAsUpIndicator () adicionada na API do Android nível 18 e superior.

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

Se você usa a biblioteca de suporte

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


5
Se você estiver usando uma gaveta, você deve chamar drawerToggle.setDrawerIndicatorEnabled(false);antes de mudar o indicador
— Floss

2
@Floss Obrigado, setDrawerIndicatorEnabled (false / true); resolvi meu problema para definir o botão home como consistente 'Voltar' e (Abrir gaveta / Fechar gaveta) com base em meus requisitos.
— Ashraf Alshahawy

1
@Floss drawerToggle.setDrawerIndicatorEnabled (false); funciona para mim :)
— Contexto

30

Eu verifiquei a pergunta. Aqui estão os passos que eu sigo. O código fonte está hospedado no GitHub: https://github.com/jiahaoliuliu/sherlockActionBarLab

Substitua o estilo real dos dispositivos anteriores à v11.

Copie e cole o código a seguir no arquivo styles.xml da pasta de valores padrão.

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

Observe que o pai pode ser alterado para qualquer tema do Sherlock.

Substitua o estilo real dos dispositivos v11 +.

Na mesma pasta em que os valores da pasta estão, crie uma nova pasta chamada values-v11. O Android procurará automaticamente o conteúdo desta pasta para dispositivos com API ou superior.

Crie um novo arquivo chamado styles.xml e cole o código a seguir no arquivo:

<?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>

Observe que o nome do estilo deve ser o mesmo que o arquivo na pasta de valores padrão e, em vez do item homeAsUpIndicator, é chamado android: homeAsUpIndicator.

O problema do item é que, para dispositivos com API 11 ou superior, a Sherlock Action Bar usa a Barra de Ação padrão que acompanha o Android, cujo nome da chave é android: homeAsUpIndicator. Porém, para os dispositivos com API 10 ou inferior, a Sherlock Action Bar usa sua própria ActionBar, que o indicador home up é chamado de "homeAsUpIndicator" simples.

Use o novo tema no manifesto

Substitua o tema do aplicativo / atividade no arquivo AndroidManifest:

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

2
E você pode tentar @ drawable / abc_ic_ab_back_holo_light ou @ drawable / abc_ic_ab_back_holo_dark se estiver procurando por ícones holo já disponíveis.
— Mason Lee

25

A alteração do ícone de navegação para trás difere do ActionBar e da Barra de Ferramentas.

Para o homeAsUpIndicatoratributo de substituição do ActionBar :

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

Para o navigationIconatributo de substituição da barra de ferramentas :

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

19

Eu fiz o código abaixo onCreate()e trabalhei comigo

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

5

Se você estiver usando a Barra de Ferramentas, não precisa dessas soluções. Você só precisa alterar o tema da barra de ferramentas

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

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

Se você estiver usando um dark.actionBar, o botão Voltar ficará branco; se você estiver usando o tema da barra de ação leve, ele ficará preto.


Seu código funciona para mim, mas podemos mudar a cor desse indicador?
— Steve Sorte

2
colorControlNormal e android: textColorSecondary Os valores são responsáveis ​​por isso, mas não tenho muita certeza do que mais esses valores também mudam. Você pode tentar definir esses valores no tema das barras de ferramentas.
— Oguz Ozcan

Estou usando "app: theme =" @ style / ThemeOverlay.AppCompat.Light "" para exibir o ícone de navegação em fundo branco, mas ele está exibindo o ícone cinza padrão, preciso alterá-lo para azul. "colorControlNormal e android: textColorSecondary" não funciona.
— Steve Sorte

2
Use um tema personalizado que tenha "ThemeOverlay.AppCompat.Light" como pai. Isso pode funcionar.
— Oguz Ozcan

1
Encontrei a solução para alterar o ícone de navegação usando name = "colorControlNormal" not name = "android: colorControlNormal". Mas eu quero mudar para o outro drawable, talvez?
— Steve Sorte

2

bandeja isso:

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

por dentro onCreate();


Ele está trabalhando, mas como voltar mais cedo botão voltar
— Nadimuddin

0

Eu usei a imagem back.png no arquivo menifest.xml do projeto. é bom trabalhar no projeto.

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

0

Eu tive o mesmo problema de direção do ícone do botão Início da barra de ação, devido à falta de gerenciamento do ícone no ícone do diretório Gradle Resource

como no diretório de recursos Gradle em árabe, você coloca o ícone em x-hdpi e, em inglês, recurso Gradle, com o mesmo nome que você coloca em uma pasta de densidade diferente como xx-hdpi, para que no APK existam dois nomes de ícones em diretórios diferentes, o dispositivo escolherá o ícone dependente da densidade pode ser RTL ou LTR

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.