如何在 ActionBar 中显示自定义视图?

Posted

技术标签:

【中文标题】如何在 ActionBar 中显示自定义视图?【英文标题】:How to display custom view in ActionBar? 【发布时间】:2012-10-04 17:24:01 【问题描述】:

我想在操作栏中显示自定义搜索(为此我使用 ActionBarSherlock)。

我明白了:

但我想让自定义布局(编辑文本字段)占据整个可用宽度。

我已经按照here 的建议实现了自定义布局。

有我的自定义布局search.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    style="?attr/actionButtonStyle"
    android:layout_
    android:layout_
    android:layout_gravity="fill_horizontal"
    android:focusable="true" >

    <FrameLayout
        android:layout_
        android:layout_
        android:layout_gravity="center_vertical|fill_horizontal" >

        <EditText
            android:id="@+id/search_query"
            android:layout_
            android:layout_
            android:layout_gravity="left|center"
            android:background="@drawable/bg_search_edit_text"
            android:imeOptions="actionSearch"
            android:inputType="text" />

        <ImageView
            android:layout_
            android:layout_
            android:layout_gravity="right|center_vertical"
            android:src="@drawable/ic_search_arrow" />

    </FrameLayout>

</LinearLayout>

MyActivity:

ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setIcon(R.drawable.ic_action_search);

LayoutInflater inflator = (LayoutInflater) this .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View v = inflator.inflate(R.layout.search, null);

actionBar.setCustomView(v);

如何使自定义布局占据actionBar 的所有可用宽度?

请帮忙。

【问题讨论】:

你能用自定义视图设置标题吗? 【参考方案1】:

这有一个技巧。您所要做的就是使用RelativeLayout 而不是LinearLayout 作为主容器。为它设置android:layout_gravity="fill_horizontal" 很重要。应该这样做。

【讨论】:

@Tomik 你能看看我的场景吗? ***.com/questions/16516306/… 设置自定义视图后我的标题丢失了。【参考方案2】:

我自己也在为此苦苦挣扎,并尝试了 Tomik 的答案。 但是,这并没有使布局在开始时达到完整的可用宽度,只有当您向视图添加内容时。

添加视图时需要设置LayoutParams.FILL_PARENT

//I'm using actionbarsherlock, but it's the same.
LayoutParams layout = new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT);
getSupportActionBar().setCustomView(overlay, layout); 

这样它就完全填满了可用空间。 (您可能也需要使用 Tomik 的解决方案)。

【讨论】:

+1,实际上,它只在添加 LayoutParams 后才对我有用,thnx 叠加值是多少? @androider 是您的自定义视图。从 xml 膨胀或在代码中创建。 你有你的工具栏布局和自定义视图的想法吗?因为这对我有用,即使我认为后者会覆盖前者【参考方案3】:

这就是它对我的工作方式(从上面的答案中,它同时显示了默认标题和我的自定义视图)。

ActionBar.LayoutParams layout = new ActionBar.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
// actionBar.setCustomView(view); //last view item must set to android:layout_alignParentRight="true" if few views are there 
actionBar.setCustomView(view, layout); // layout param width=fill/match parent
actionBar.setDisplayShowCustomEnabled(true);//must other wise its not showing custom view.

我注意到setCustomView(view)setCustomView(view,params) 的视图宽度=匹配/填充父级。 setDisplayShowCustomEnabled (boolean showCustom)

【讨论】:

将 MATCH_PARENT 更改为 WRAP_CONTENT 作为第二个参数的值就可以了。使用线性布局...【参考方案4】:

Tomik 和 Peterdk 的答案适用于您希望自定义视图占据整个操作栏,甚至隐藏本机标题。

但是,如果您希望自定义视图与标题并排显示(并在显示标题后填充所有剩余空间),那么我可以在这里向您推荐用户 Android-Developer 的出色回答:

https://***.com/a/16517395/614880

他在底部的代码非常适合我。

【讨论】:

【参考方案5】:

例如,您可以定义一个包含 EditText 元素的布局文件。

<?xml version="1.0" encoding="utf-8"?>
<EditText xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/searchfield"
    android:layout_
    android:layout_
    android:inputType="textFilter" >

</EditText> 

你可以的

public class MainActivity extends Activity 

  @Override
  protected void onCreate(Bundle savedInstanceState) 
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    ActionBar actionBar = getActionBar();
    // add the custom view to the action bar
    actionBar.setCustomView(R.layout.actionbar_view);
    EditText search = (EditText) actionBar.getCustomView().findViewById(R.id.searchfield);
    search.setOnEditorActionListener(new OnEditorActionListener() 

      @Override
      public boolean onEditorAction(TextView v, int actionId,
          KeyEvent event) 
        Toast.makeText(MainActivity.this, "Search triggered",
            Toast.LENGTH_LONG).show();
        return false;
      
    );
    actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM
        | ActionBar.DISPLAY_SHOW_HOME);


    

【讨论】:

节省了我的 n 小时.. 谢谢【参考方案6】:

在 Android 的启动器应用程序中有一个示例(我已经用它制作了一个库,在这里),在处理壁纸挑选的类 ("WallpaperPickerActivity") 中。

该示例显示您需要设置自定义主题才能使其正常工作。可悲的是,这对我来说只适用于普通框架,而不是支持库之一。

以下是主题:

styles.xml

 <style name="Theme.WallpaperPicker" parent="Theme.WallpaperCropper">
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:colorBackgroundCacheHint">@null</item>
    <item name="android:windowShowWallpaper">true</item>
  </style>

  <style name="Theme.WallpaperCropper" parent="@android:style/Theme.DeviceDefault">
    <item name="android:actionBarStyle">@style/WallpaperCropperActionBar</item>
    <item name="android:windowFullscreen">true</item>
    <item name="android:windowActionBarOverlay">true</item>
  </style>

  <style name="WallpaperCropperActionBar" parent="@android:style/Widget.DeviceDefault.ActionBar">
    <item name="android:displayOptions">showCustom</item>
    <item name="android:background">#88000000</item>
  </style>

value-v19/styles.xml

 <style name="Theme.WallpaperCropper" parent="@android:style/Theme.DeviceDefault">
    <item name="android:actionBarStyle">@style/WallpaperCropperActionBar</item>
    <item name="android:windowFullscreen">true</item>
    <item name="android:windowActionBarOverlay">true</item>
    <item name="android:windowTranslucentNavigation">true</item>
  </style>

  <style name="Theme" parent="@android:style/Theme.DeviceDefault.Wallpaper.NoTitleBar">
    <item name="android:windowTranslucentStatus">true</item>
    <item name="android:windowTranslucentNavigation">true</item>
  </style>

编辑:有一种更好的方法,它也适用于支持库。只需添加这行代码,而不是我上面写的:

getSupportActionBar().setDisplayShowCustomEnabled(true);

【讨论】:

以上是关于如何在 ActionBar 中显示自定义视图?的主要内容,如果未能解决你的问题,请参考以下文章

如何创建自定义 ActionBar?

ActionBar - 具有居中 ImageView 的自定义视图,两侧的操作项

如何在特定时间显示自定义警报?

如何在表格视图单元格中快速自定义和实现滑块

自定义半透明Android ActionBar

如何将 UIView 插座连接到自定义子视图