developer tip

ActionBar의 홈 아이콘과 제목 사이의 패딩

optionbox 2020. 8. 6. 08:15
반응형

ActionBar의 홈 아이콘과 제목 사이의 패딩


아무도 ActionBar의 홈 아이콘과 제목 사이에 패딩을 설정하는 방법을 알고 있습니까?


Cliffus 답변을 수정하고 res / style.xml과 같이 작업 표시 줄 스타일 정의에 로고 드로어 블을 할당했습니다.

<item name="android:actionBarStyle">@style/MyActionBar</item>

<style name="MyActionBar" parent="@android:style/Widget.Holo.Light.ActionBar">
        <item name="android:background">#3f51b5</item>
        <item name="android:titleTextStyle">@style/ActionBar.TitleText</item>
        <item name="android:textColor">#fff</item>
        <item name="android:textSize">18sp</item>
        <item name="android:logo">@drawable/actionbar_space_between_icon_and_title</item>
</style>

드로어 블은 res / drawable / actionbar_space_between_icon_and_title.xml에서 Cliffus의 것 (여기서는 기본 앱 실행기 아이콘이 있음)처럼 보입니다.

<?xml version="1.0" encoding="utf-8"?>
<layer-list
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:drawable="@drawable/ic_launcher"
        android:right="20dp"/>
</layer-list>

android_manifest.xml에서 여전히 다른 앱 아이콘 ( 'desktop'의 실행기 아이콘)을 설정할 수 있습니다. 여기에 다른 로고 정의는 작업 표시 줄이없는 활동에 표시됩니다.


편집 : 주석 작성자 중 일부와 마찬가지로 앱 아이콘이 아닌 이 드로어 블을 LOGO 로 설정하십시오 .

XML을 드로어 블로 만들어 리소스 폴더 "드로어 블"(밀도 나 다른 구성없이)에 넣으십시오.

<?xml version="1.0" encoding="utf-8"?>
<layer-list
    xmlns:android="http://schemas.android.com/apk/res/android" >

    <item
        android:drawable="@drawable/my_logo"
        android:right="10dp"/>


</layer-list>

마지막 단계는이 새로운 드로어 블을 매니페스트 (또는 활동의 작업 표시 줄 개체)에 로고로 설정하는 것입니다.

행운을 빕니다!


나는 비슷한 문제에 직면했다. 내 경우에는 내용에 따라 각 활동에 대해 제목을 동적으로 설정해야했다.

그래서 이것은 나를 위해 일했습니다.

actionBar.setTitle("  " + yourActivityTitle);

간격이 원하는 경우 이것이 내가 생각할 수있는 가장 쉬운 솔루션입니다.


이것이 홈 아이콘과 제목 사이에 패딩을 설정하는 방법입니다.

ImageView view = (ImageView)findViewById(android.R.id.home);
view.setPadding(left, top, right, bottom);

그래도 ActionBar xml 스타일을 통해 이것을 사용자 정의하는 방법을 찾을 수 없었습니다. 즉, 다음 XML이 작동하지 않습니다.

<style name="ActionBar" parent="android:style/Widget.Holo.Light.ActionBar">        
    <item name="android:titleTextStyle">@style/ActionBarTitle</item>
    <item name="android:icon">@drawable/ic_action_home</item>        
</style>

<style name="ActionBarTitle" parent="android:style/TextAppearance.Holo.Widget.ActionBar.Title">
    <item name="android:textSize">18sp</item>
    <item name="android:paddingLeft">12dp</item>   <!-- Can't get this padding to work :( -->
</style>

그러나 xml을 통해이를 달성하려는 경우 다음 두 링크가 솔루션을 찾는 데 도움이 될 수 있습니다.

https://github.com/android/platform_frameworks_base/blob/master/core/res/res/values/styles.xml

(이것은 작업 표시 줄에 홈 아이콘을 표시하는 데 사용되는 실제 레이아웃입니다) https://github.com/android/platform_frameworks_base/blob/master/core/res/res/layout/action_bar_home.xml


머티리얼 디자인에서 일반적인 질문입니다. 툴바 제목을 아래 조각의 내용과 일치 시키십시오. 이를 위해 아래 표시된 것처럼 toolbar.xml 레이아웃에서 attributeInsetStart = "72dp" 속성을 사용하여 "12dp"의 기본 패딩을 재정의 할 수 있습니다.

toolbar.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/app_theme_color"
    app:contentInsetStart="72dp"/>

그런 다음 활동에서 전화

Toolbar toolbar = (Toolbar) activity.findViewById(R.id.toolbar);
toolbar.setTitle("Title Goes Here");

그리고 당신은 이것으로 끝납니다 :

툴바


나를 위해 API 18에서 24까지 테스트 한 다음 조합 만 작동했습니다.

app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetStartWithNavigation="0dp"

"앱"의 위치는 다음과 같습니다. xmlns:app="http://schemas.android.com/apk/res-auto"

예를 들어.

 <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="@color/SE_Life_Green"
                app:contentInsetLeft="0dp"
                app:contentInsetStart="0dp"
                app:contentInsetStartWithNavigation="0dp"
                >
                .......
                .......
                .......
            </android.support.v7.widget.Toolbar>

AppCompat (android.support.v7.widget.Toolbar,> = 개정 24, 2016 년 6 월 24 일)에서 툴바를 사용하는 경우 아이콘과 제목 사이의 패딩을 다음 값으로 변경할 수 있습니다.

  app:contentInsetStartWithNavigation="0dp"

내 대답을 향상시키기 위해 활동 내에서 툴바에서 직접 사용하거나 툴바에 대한 새 레이아웃 파일을 만들 수 있습니다. 이 경우 필요한 각보기에서 include 속성을 사용하여 툴바의 @id를 가져와야합니다.

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:elevation="4dp"
    app:contentInsetLeft="0dp"
    app:contentInsetStart="0dp"
    app:contentInsetStartWithNavigation="0dp">
</android.support.v7.widget.Toolbar>

그런 다음 activity.xml에서 레이아웃을 가져올 수 있습니다

<include
        layout="@layout/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

titleMarginStart나를 위해 작품을 사용 합니다. Xamarin 예 :

<android.support.v7.widget.Toolbar
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:id="@+id/toolbar"
  android:layout_height="wrap_content"
  android:layout_width="match_parent"
  android:minHeight="?attr/actionBarSize"
  android:background="?attr/colorPrimary"
  app:titleMarginStart="24dp"/>

로고를 다음과 같이 설정하십시오.

mToolbar = FindViewById<SupportToolbar>(Resource.Id.toolbar);
SetSupportActionBar(mToolbar);
SupportActionBar.SetLogo(Resource.Drawable.titleicon32x32);
SupportActionBar.SetDisplayShowHomeEnabled(true);
SupportActionBar.SetDisplayUseLogoEnabled(true);
SupportActionBar.Title = "App title";

제목 앞에 \ t를 사용하고 나를 위해 일했습니다.


내 앱 로고 오른쪽의 기본 제목 텍스트 대신 사용자 지정 이미지를 사용하고 있습니다. 이것은 프로그래밍 방식으로 설정됩니다.

    actionBar.setDisplayHomeAsUpEnabled(true);
    actionBar.setDisplayUseLogoEnabled(true);
    actionBar.setCustomView(R.layout.include_ab_txt_logo);
    actionBar.setDisplayShowCustomEnabled(true);

The issues with the above answers for me are @Cliffus's suggestion does not work for me due to the issues others have outlined in the comments and while @dushyanth programatic padding setting may have worked in the past I would think that the fact that the spacing is now set using android:layout_marginEnd="8dip" since API 17 manually setting the padding should have no effect. See the link he posted to git to verify its current state.

A simple solution for me is to set a negative margin on my custom view in the actionBar, like so android:layout_marginLeft="-14dp". A quick test shows it works for me on 2.3.3 and 4.3 using ActionBarCompat

Hope this helps someone!


I solved this problem by using custom Navigation layout

Using it you can customize anything in title on action bar:

build.gradle

dependencies {
    compile 'com.android.support:appcompat-v7:21.0.+'
    ...
}

AndroidManifest.xml

<application
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name">
        <activity
            android:name=".MainActivity"
            android:theme="@style/ThemeName">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
</application>

styles.xml

<style name="ThemeName" parent="Theme.AppCompat.Light">
   <item name="actionBarStyle">@style/ActionBar</item>
   <item name="android:actionBarStyle" tools:ignore="NewApi">@style/ActionBar</item>

<style name="ActionBar" parent="Widget.AppCompat.ActionBar">
   <item name="displayOptions">showCustom</item>
   <item name="android:displayOptions" tools:ignore="NewApi">showCustom</item>

    <item name="customNavigationLayout">@layout/action_bar</item>
   <item name="android:customNavigationLayout" tools:ignore="NewApi">@layout/action_bar</item>

    <item name="background">@color/android:white</item>
   <item name="android:background">@color/android:white</item>

action_bar.xml

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
          android:id="@+id/action_bar_title"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:gravity="center_vertical"
          android:drawableLeft="@drawable/ic_launcher"
          android:drawablePadding="10dp"
          android:textSize="20sp"
          android:textColor="@android:color/black"
          android:text="@string/app_name"/>

I had a similar issue but with spacing between the up and the custom app icon/logo in the action bar. Dushyanth's solution of setting padding programatically worked for me (setting padding on app/logo icon). I tried to find either android.R.id.home or R.id.abs__home (ActionBarSherlock only, as this ensures backwards compatibility), and it seems to work across 2.3-4.3 devices I've tested on.


For my case, it was with Toolbar i resolved it like this:

ic_toolbar_drawble.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
    android:drawable="@drawable/ic_toolbar"
    android:right="-16dp"
    android:left="-16dp"/>
</layer-list>

In my Fragment, i check the api :

if (android.os.Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP)
      toolbar.setLogo(R.drawable.ic_toolbar);
else
      toolbar.setLogo(R.drawable.ic_toolbar_draweble);

Good luck!


You can change drawableSize of your DrawerArrow like this:

<style name="MyTheme" parent="android:Theme.WithActionBar">
    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
</style>

<style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="barLength">24dp</item>
    <item name="arrowShaftLength">24dp</item>
    <item name="arrowHeadLength">10dp</item>
    <item name="drawableSize">42dp</item> //this is your answer
</style>

It isn't correct answer, because you can't choose padding side and DrawerArrow icon scaling when change drawableSize (drawableSize = width = height). But you can margin from left. To margin from right do

findViewById(android.R.id.home).setPadding(10, 0, 5, 0);

I used this method setContentInsetsAbsolute(int contentInsetLeft, int contentInsetRight) and it works!

int padding = getResources().getDimensionPixelSize(R.dimen.toolbar_content_insets);
mToolbar.setContentInsetsAbsolute(padding, 0);

When you are using a custom Toolbar, you can use

toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.setTitle(R.string.activity_title);
setSupportActionBar(toolbar);
getSupportActionBar().setLogo(R.drawable.logo);

and in your toolbar layout simply set app:titleMarginStart="16dp"

Note that you have to set the icon as a logo, don't use getSupportActionBar().setIcon(R.drawable.logo) instead use: getSupportActionBar().setLogo(R.drawable.logo)


I used AppBarLayout and custom ImageButton do to so.

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:elevation="0dp"
    android:background="@android:color/transparent"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

   <RelativeLayout
       android:layout_width="match_parent"
       android:layout_height="match_parent">

       <ImageView
           android:layout_width="32dp"
           android:layout_height="32dp"
           android:src="@drawable/selector_back_button"
           android:layout_centerVertical="true"
           android:layout_marginLeft="8dp"
           android:id="@+id/back_button"/>

       <android.support.v7.widget.Toolbar
           android:id="@+id/toolbar"
           android:layout_width="match_parent"
           android:layout_height="?attr/actionBarSize"
           app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
    </RelativeLayout>    
</android.support.design.widget.AppBarLayout>

My Java code:

findViewById(R.id.appbar).bringToFront();
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
final ActionBar ab = getSupportActionBar();
getSupportActionBar().setDisplayShowTitleEnabled(false);

You can achieve same by method as well:

Drawable d = new InsetDrawable(getDrawable(R.drawable.nav_icon),0,0,10,0);
mToolbar.setLogo(d);

In your XML, set the app:titleMargin in your Toolbar view as following:

<androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:titleMarginStart="16dp"/>

Or in your code:

toolbar.setTitleMargin(16,16,16,16); // start, top, end, bottom

this work for me to add padding to the title and for ActionBar icon i have set that programmatically.

 getActionBar().setTitle(Html.fromHtml("<font color='#fffff'>&nbsp;&nbsp;&nbsp;Boat App </font>"));

<string name="app_name">"    "Brick Industry</string>

" "앱 이름 만 추가하면 아이콘과 제목 사이에 공백이 추가됩니다

참고 URL : https://stackoverflow.com/questions/9737101/padding-between-actionbars-home-icon-and-title

반응형