[英]How can I implement custom Action Bar with custom buttons in Android?
I want to implement custom ActionBar
which must look like this: 我想实现自定义
ActionBar
,它必须如下所示:
So questions: 所以问题:
ActionBar
? ActionBar
的顶部画一条线? ActionBar
or what? ActionBar
上添加标签或者什么? This is pretty much as close as you'll get if you want to use the ActionBar
APIs. 如果您想使用
ActionBar
API,这与您将获得的非常接近。 I'm not sure you can place a colorstrip above the ActionBar
without doing some weird Window
hacking, it's not worth the trouble. 我不确定你是否可以在
ActionBar
上面放置一个颜色条而不做一些奇怪的Window
hacking,这不值得麻烦。 As far as changing the MenuItems
goes, you can make those tighter via a style. 就改变
MenuItems
而言,你可以通过一种风格来改变它们。 It would be something like this, but I haven't tested it. 它会是这样的,但我还没有测试过。
<style name="MyTheme" parent="android:Theme.Holo.Light">
<item name="actionButtonStyle">@style/MyActionButtonStyle</item>
</style>
<style name="MyActionButtonStyle" parent="Widget.ActionButton">
<item name="android:minWidth">28dip</item>
</style>
Here's how to inflate and add the custom layout to your ActionBar
. 以下是如何为
ActionBar
充气并添加自定义布局。
// Inflate your custom layout
final ViewGroup actionBarLayout = (ViewGroup) getLayoutInflater().inflate(
R.layout.action_bar,
null);
// Set up your ActionBar
final ActionBar actionBar = getActionBar();
actionBar.setDisplayShowHomeEnabled(false);
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setCustomView(actionBarLayout);
// You customization
final int actionBarColor = getResources().getColor(R.color.action_bar);
actionBar.setBackgroundDrawable(new ColorDrawable(actionBarColor));
final Button actionBarTitle = (Button) findViewById(R.id.action_bar_title);
actionBarTitle.setText("Index(2)");
final Button actionBarSent = (Button) findViewById(R.id.action_bar_sent);
actionBarSent.setText("Sent");
final Button actionBarStaff = (Button) findViewById(R.id.action_bar_staff);
actionBarStaff.setText("Staff");
final Button actionBarLocations = (Button) findViewById(R.id.action_bar_locations);
actionBarLocations.setText("HIPPA Locations");
Here's the custom layout: 这是自定义布局:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:enabled="false"
android:orientation="horizontal"
android:paddingEnd="8dip" >
<Button
android:id="@+id/action_bar_title"
style="@style/ActionBarButtonWhite" />
<Button
android:id="@+id/action_bar_sent"
style="@style/ActionBarButtonOffWhite" />
<Button
android:id="@+id/action_bar_staff"
style="@style/ActionBarButtonOffWhite" />
<Button
android:id="@+id/action_bar_locations"
style="@style/ActionBarButtonOffWhite" />
</LinearLayout>
Here's the color strip layout: To use it, just use merge
in whatever layout you inflate in setContentView
. 这是颜色条布局:要使用它,只需在
setContentView
膨胀的任何布局中使用merge
。
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="@dimen/colorstrip"
android:background="@android:color/holo_blue_dark" />
Here are the Button
styles: 以下是
Button
样式:
<style name="ActionBarButton">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:background">@null</item>
<item name="android:ellipsize">end</item>
<item name="android:singleLine">true</item>
<item name="android:textSize">@dimen/text_size_small</item>
</style>
<style name="ActionBarButtonWhite" parent="@style/ActionBarButton">
<item name="android:textColor">@color/white</item>
</style>
<style name="ActionBarButtonOffWhite" parent="@style/ActionBarButton">
<item name="android:textColor">@color/off_white</item>
</style>
Here are the colors and dimensions I used: 以下是我使用的颜色和尺寸:
<color name="action_bar">#ff0d0d0d</color>
<color name="white">#ffffffff</color>
<color name="off_white">#99ffffff</color>
<!-- Text sizes -->
<dimen name="text_size_small">14.0sp</dimen>
<dimen name="text_size_medium">16.0sp</dimen>
<!-- ActionBar color strip -->
<dimen name="colorstrip">5dp</dimen>
If you want to customize it more than this, you may consider not using the ActionBar
at all, but I wouldn't recommend that. 如果你想更多地自定义它,你可能会考虑根本不使用
ActionBar
,但我不建议这样做。 You may also consider reading through the Android Design Guidelines to get a better idea on how to design your ActionBar.
您还可以考虑阅读Android设计指南 ,以更好地了解如何设计
ActionBar.
If you choose to forgo the ActionBar
and use your own layout instead, you should be sure to add action-able Toasts
when users long press your "MenuItems". 如果您选择放弃
ActionBar
并使用自己的布局,则应确保在用户长按“MenuItems”时添加Toasts
。 This can be easily achieved using this Gist . 使用此Gist可以轻松实现这一点 。
1 You can use a drawable 1您可以使用drawable
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@+id/menu_item1"
android:icon="@drawable/my_item_drawable"
android:title="@string/menu_item1"
android:showAsAction="ifRoom" />
</menu>
2 Create a style for the action bar and use a custom background: 2为操作栏创建样式并使用自定义背景:
<resources>
<!-- the theme applied to the application or activity -->
<style name="CustomActivityTheme" parent="@android:style/Theme.Holo">
<item name="android:actionBarStyle">@style/MyActionBar</item>
<!-- other activity and action bar styles here -->
</style>
<!-- style for the action bar backgrounds -->
<style name="MyActionBar" parent="@android:style/Widget.Holo.ActionBar">
<item name="android:background">@drawable/background</item>
<item name="android:backgroundStacked">@drawable/background</item>
<item name="android:backgroundSplit">@drawable/split_background</item>
</style>
</resources>
3 Style again android:actionBarDivider 3再次设置android:actionBarDivider
The android documentation is very usefull for that. android文档对此非常有用。
Please write following code in menu.xml file: 请在menu.xml文件中编写以下代码:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:my_menu_tutorial_app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.example.mymenus.menu_app.MainActivity">
<item android:id="@+id/item_one"
android:icon="@drawable/menu_icon"
android:orderInCategory="l01"
android:title="Item One"
my_menu_tutorial_app:showAsAction="always">
<!--sub-menu-->
<menu>
<item android:id="@+id/sub_one"
android:title="Sub-menu item one" />
<item android:id="@+id/sub_two"
android:title="Sub-menu item two" />
</menu>
Also write this java code in activity class file: 还要在活动类文件中编写此java代码:
public boolean onOptionsItemSelected(MenuItem item)
{
super.onOptionsItemSelected(item);
Toast.makeText(this, "Menus item selected: " +
item.getTitle(), Toast.LENGTH_SHORT).show();
switch (item.getItemId())
{
case R.id.sub_one:
isItemOneSelected = true;
supportInvalidateOptionsMenu();
return true;
case MENU_ITEM + 1:
isRemoveItem = true;
supportInvalidateOptionsMenu();
return true;
default:
return false;
}
}
This is the easiest way to display menus in action bar. 这是在操作栏中显示菜单的最简单方法。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.