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.