【问题标题】:how to reduce the space between icon and home up key in custom action bar in android如何在android中的自定义操作栏中减少图标和主页键之间的空间
【发布时间】:2017-07-17 07:49:39
【问题描述】:

我在 AppCompatActivity 中使用自定义操作栏。我在下面给出我的代码以及投手。我尝试了堆栈溢出中可用的所有解决方案。但是直到我无法解决这个问题。请帮助我。

action_toolbar.xml

<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"
style="@style/toolBarTheme"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
app:contentInsetStart="0dp"
app:theme="@style/AppTheme.AppBarOverlay">

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

    <ImageView
        android:id="@+id/appLogo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="@string/app_name"
        android:src="@mipmap/ic_launcher" />

    <TextView
        android:id="@+id/tvToolbarTitle"
        style="@style/textViewTheme"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@+id/appLogo"
        android:layout_toEndOf="@+id/appLogo"
        android:layout_marginLeft="14dp"
        android:layout_marginStart="14dp" />
</RelativeLayout>

【问题讨论】:

    标签: android android-layout android-actionbar


    【解决方案1】:

    您可以为此使用toolbar 属性

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

    工具栏中的这种用法

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

    【讨论】:

      【解决方案2】:

      如果您使用的是Toolbar,则在Toolbar 中添加以下行xml

      app:contentInsetStart="0dp"
      

      更新:

      你的意思是你想要像 Whatsapp 这样的工具栏。但这不是通过使用 App-compat Support Library Toolbar 完成的,您必须使用自定义操作栏。

      你可以得到如下图所示的结果

      使用以下代码。

      activity.xml

      <android.support.design.widget.AppBarLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content" >
      
          <android.support.v7.widget.Toolbar
              android:id="@+id/toolbar_chats"
              android:layout_width="match_parent"
              android:layout_height="?attr/actionBarSize"
              android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
              app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
                  <include layout="@layout/custom_toolbar"/>
      </android.support.v7.widget.Toolbar>
      </android.support.design.widget.AppBarLayout>
      

      custom_toolbar.xml

      <?xml version="1.0" encoding="utf-8"?>
      <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:background="?attr/selectableItemBackgroundBorderless"
      android:layout_width="fill_parent"
      android:layout_height="?actionBarSize"
      >
      <!-- android:background="?attr/selectableItemBackgroundBorderless" will cause this Custom View to make ripple effect -->
      
      <LinearLayout
          android:id="@+id/conversation_image"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_alignParentLeft="true"
          android:layout_centerVertical="true"
          android:contentDescription="@string/abc_action_bar_up_description"
          android:orientation="horizontal">
      
              <ImageView
                  android:id="@+id/conversation_contact_photo"
                  android:layout_width="35.0dip"
                  android:layout_height="35.0dip"
                  android:src="@drawable/icon"
                  android:scaleType="fitCenter" />
      </LinearLayout>
      
      <LinearLayout
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_centerVertical="true"
          android:layout_toRightOf="@id/conversation_image"
          android:orientation="vertical"
          android:paddingBottom="2.0dip"
          android:paddingLeft="4.0dip"
          android:paddingRight="0.0dip"
          android:paddingTop="0.0dip" >
      
      
          <TextView
              android:id="@+id/action_bar_title_1"
              android:layout_width="wrap_content"
              android:layout_height="0dp"
              android:layout_gravity="center_vertical"
              android:layout_marginLeft="6dp"
              android:layout_weight="0.6"
              android:ellipsize="end"
              android:gravity="center_vertical"
              android:maxLines="1"
              android:textSize="18sp"
              android:text="shanraisshan"
              android:textStyle="bold" />
      
          <TextView
              android:id="@+id/action_bar_title_2"
              android:layout_width="wrap_content"
              android:layout_height="0dp"
              android:layout_marginLeft="6dp"
              android:layout_weight="0.4"
              android:ellipsize="end"
              android:text="last seen 1 hour ago"
              android:maxLines="1"
              android:textSize="12sp" />
      
      
      </LinearLayout>
      

      YourActivity.java

      final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar_chats);
      setSupportActionBar(toolbar);
      getSupportActionBar().setDisplayHomeAsUpEnabled(true);
      toolbar.setOnClickListener(new View.OnClickListener() {
          @Override
          public void onClick(View v) {
              Log.e("Toolbar","Clicked");
          }
      });
      

      【讨论】:

      • 是的,试过了。看我的代码。要使用这个我的主要活动正常工作。但是新活动不起作用
      • 非常抱歉@Mehul 现在只有我看到了你的回答。但它不工作。但在 Ans 上面工作正常,我就这么做了。谢谢你
      • 矢量图标周围似乎有一个填充,以防止空间进一步减少。有什么方法可以减少填充?