android 操作栏中带有文本和标题的后退按钮
Back button with text and title in android action bar
我没有使用 Toolbar
或 ActionbarActivity
。我正在使用普通的 activity 。我的 activity 有一个 actionbar 。我想以 activity 的标题在中间对齐并且有一个带有一些文本的后退按钮的方式对其进行自定义。喜欢这张图片
。我正在为我的 actionbar 使用自定义布局并且设计没问题,后退按钮也能正常工作。但问题是带有后退按钮的文本是可点击的。
这是我试过的
getActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
getActionBar().setCustomView(R.layout.custom_actionbar_title);
getActionBar().setDisplayHomeAsUpEnabled(true);
custom_actionbar_title
的布局
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="16.0"
android:weightSum="16.0">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:text="Incidents"
android:gravity="left"
android:layout_weight="5"
android:textColor="#ffffff"
android:id="@+id/backButtonText"
android:textSize="18sp" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textAlignment="center"
android:layout_weight="6"
android:text="Detail"
android:gravity="center"
android:textColor="#ffffff"
android:id="@+id/title"
android:textSize="18sp" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text=""
android:layout_weight="5"
android:layout_gravity="end"/>
</LinearLayout>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<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">
"your back button & textview code here"
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
你可以根据自己的喜好编辑:
做一个单独的 xml :让我们说 app_bar 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:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:theme="@style/AppTheme.AppBarOverlay"
android:minHeight="?attr/actionBarSize">
<LinearLayout
android:id="@+id/ll_back_image"
android:layout_width="50dp"
android:layout_height="48dp"
android:visibility="invisible"
android:gravity="left">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:icon="@mipmap/back"
android:layout_gravity="center"
android:gravity="end|center"
android:id="@+id/toolbar_back_image"/>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textSize="17dp"
android:textStyle="bold"
android:textColor="#fff"
android:id="@+id/toolbar_title"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:visibility="invisible"
android:layout_gravity="right"
android:icon="@mipmap/ic_sort_white_24dp"
android:id="@+id/filter_img_id"/>
</android.support.v7.widget.Toolbar>
在你的main_activity.xml中包含上面的布局//你可以根据你的xml:like改变这个:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusable="false"
android:focusableInTouchMode="false"
android:background="@color/faintwhite"
android:id="@+id/container">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<include
android:id="@+id/tool_bar"
layout="@layout/app_bar"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center"
android:layout_below="@+id/tool_bar">
<LinearLayout
android:id="@+id/lin_lay"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
<LinearLayout
android:id="@+id/linear2"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</FrameLayout>
如果您使用片段:
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
view = inflater.inflate(R.layout.mini_detail, container, false);
findAllId();
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
Window window = getActivity().getWindow();
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.setStatusBarColor(MiniDetail.this.getResources().getColor(R.color.colorPrimary));
}
((AppCompatActivity) getActivity()).setSupportActionBar(toolbar);// action bar
((AppCompatActivity) getActivity()).getSupportActionBar().setDisplayShowTitleEnabled(false);
TextView tv= (TextView) toolbar.findViewById(R.id.toolbar_title);
tv.setText("MUMBA");
如果您正在使用 Activity:
public class SplashScreen extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.splash_screen);
Toolbar toolbar = (Toolbar)findViewById(R.id.tool_bar);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
Window window = getWindow();
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.setStatusBarColor(SplashScreen.this.getResources().getColor(R.color.black));
}
toolbar.setBackgroundColor(getResources().getColor(R.color.black));
setSupportActionBar(toolbar);// action bar
getSupportActionBar().setDisplayShowTitleEnabled(false);
TextView tv= (TextView) toolbar.findViewById(R.id.toolbar_title);
tv.setText("Welcome");
我没有使用 Toolbar
或 ActionbarActivity
。我正在使用普通的 activity 。我的 activity 有一个 actionbar 。我想以 activity 的标题在中间对齐并且有一个带有一些文本的后退按钮的方式对其进行自定义。喜欢这张图片
。我正在为我的 actionbar 使用自定义布局并且设计没问题,后退按钮也能正常工作。但问题是带有后退按钮的文本是可点击的。
这是我试过的
getActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
getActionBar().setCustomView(R.layout.custom_actionbar_title);
getActionBar().setDisplayHomeAsUpEnabled(true);
custom_actionbar_title
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="16.0"
android:weightSum="16.0">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:text="Incidents"
android:gravity="left"
android:layout_weight="5"
android:textColor="#ffffff"
android:id="@+id/backButtonText"
android:textSize="18sp" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textAlignment="center"
android:layout_weight="6"
android:text="Detail"
android:gravity="center"
android:textColor="#ffffff"
android:id="@+id/title"
android:textSize="18sp" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text=""
android:layout_weight="5"
android:layout_gravity="end"/>
</LinearLayout>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<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">
"your back button & textview code here"
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
你可以根据自己的喜好编辑:
做一个单独的 xml :让我们说 app_bar 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:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:theme="@style/AppTheme.AppBarOverlay"
android:minHeight="?attr/actionBarSize">
<LinearLayout
android:id="@+id/ll_back_image"
android:layout_width="50dp"
android:layout_height="48dp"
android:visibility="invisible"
android:gravity="left">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:icon="@mipmap/back"
android:layout_gravity="center"
android:gravity="end|center"
android:id="@+id/toolbar_back_image"/>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textSize="17dp"
android:textStyle="bold"
android:textColor="#fff"
android:id="@+id/toolbar_title"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:visibility="invisible"
android:layout_gravity="right"
android:icon="@mipmap/ic_sort_white_24dp"
android:id="@+id/filter_img_id"/>
</android.support.v7.widget.Toolbar>
在你的main_activity.xml中包含上面的布局//你可以根据你的xml:like改变这个:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusable="false"
android:focusableInTouchMode="false"
android:background="@color/faintwhite"
android:id="@+id/container">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<include
android:id="@+id/tool_bar"
layout="@layout/app_bar"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center"
android:layout_below="@+id/tool_bar">
<LinearLayout
android:id="@+id/lin_lay"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
<LinearLayout
android:id="@+id/linear2"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</FrameLayout>
如果您使用片段:
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
view = inflater.inflate(R.layout.mini_detail, container, false);
findAllId();
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
Window window = getActivity().getWindow();
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.setStatusBarColor(MiniDetail.this.getResources().getColor(R.color.colorPrimary));
}
((AppCompatActivity) getActivity()).setSupportActionBar(toolbar);// action bar
((AppCompatActivity) getActivity()).getSupportActionBar().setDisplayShowTitleEnabled(false);
TextView tv= (TextView) toolbar.findViewById(R.id.toolbar_title);
tv.setText("MUMBA");
如果您正在使用 Activity:
public class SplashScreen extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.splash_screen);
Toolbar toolbar = (Toolbar)findViewById(R.id.tool_bar);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
Window window = getWindow();
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.setStatusBarColor(SplashScreen.this.getResources().getColor(R.color.black));
}
toolbar.setBackgroundColor(getResources().getColor(R.color.black));
setSupportActionBar(toolbar);// action bar
getSupportActionBar().setDisplayShowTitleEnabled(false);
TextView tv= (TextView) toolbar.findViewById(R.id.toolbar_title);
tv.setText("Welcome");