如何使ActionBar和堆叠条共享相同的背景图像

时间:2015-11-18 19:25:04

标签: android android-actionbar android-styles android-style-tabhost

动作栏及其堆叠栏(包含导航标签的栏)是否可以共享相同的背景图像?一个从动作栏开始并以堆积条结束?

目前实现这一目标的方式,最终得到的动作栏上有自己的图像和堆叠的条形图。

my styles.xml

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="android:actionBarStyle">@style/MyActionBar</item>
    <item name="android:actionMenuTextColor">@color/app_yellow</item>
    <item name="android:windowActionBarOverlay">true</item>

    <!-- Support library compatibility -->
    <item name="actionBarStyle">@style/MyActionBar</item>
    <item name="actionMenuTextColor">@color/app_yellow</item>
</style>

<!-- ActionBar styles -->
<style name="MyActionBar" parent="@style/Widget.AppCompat.Light.ActionBar">

    <item name="android:titleTextStyle">@style/MyActionBarTitleText</item>

    <item name="android:actionBarTabTextStyle">@style/MyActionBarTabText</item>

    <item name ="android:actionBarTabStyle">@style/MyTabStyle</item>

    <item name="background">@drawable/actionbar</item>

</style>

 <!-- individual ActionBar tabs style -->
<style name="MyTabStyle" parent ="Widget.AppCompat.Light.ActionBar.TabView">
    <item name ="background">@android:color/transparent</item>
    <item name ="android:background">@android:color/transparent</item>

</style>

在我的活动中

  @Override
protected void onCreate(Bundle savedInstanceState) {

    super.onCreate(savedInstanceState);

    setContentView(R.layout.activity_main);

   ActionBar actionBar = getSupportActionBar();
    // Specify that tabs should be displayed in the action bar.
    actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
    actionBar.setLogo(R.mipmap.ic_launcher);
    actionBar.setDisplayUseLogoEnabled(true);
    actionBar.setDisplayShowHomeEnabled(true);
    actionBar.setStackedBackgroundDrawable(getResources().getDrawable(R.drawable.actionbar));

2 个答案:

答案 0 :(得分:2)

Michael De Soto 指导(参见上面的评论),我可以通过使用具有

的工具栏让操作栏和堆积条共享相同的背景图像
  • 视图中的操作栏详细信息(例如图标,标题)(标题的textview,图标的imageview等)

  • 在tablayout中堆积条形细节(基本上是标签)。

my output 这里我是如何实现它们的

我的活动xml

    ini_set('display_errors', '1');
    // $myServer = "winsrv22.somedns.co.uk:22320";//this style works as well
    $servername = "123.21.47.23:22320";
    $myUser = "UserName";
    $myPass = 'xxxxxxxx';
    $myDB = "[database]"; 

    //connection to the database
    $dbhandle = mssql_connect($servername, $myUser, $myPass)
        or die("Couldn'tt connect to SQL Server on $myServer"); 
    if($dbhandle) {
     echo "Success, Connected\r\n";
    } else {
        echo "problem :( \r\n";
    }

在styles.xml

中添加了以下内容
<android.support.v7.widget.Toolbar
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?attr/actionBarSize"
    android:id="@+id/mainActivityBar"
    android:layout_alignParentTop="true"
    android:background="@drawable/actionbar"
    app:contentInsetLeft="0dp"
    app:contentInsetStart="0dp"
    app:contentInsetEnd="0dp"
    app:contentInsetRight="0dp"
  >
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="President"
            android:id="@+id/appname_1"
            android:background="@android:color/transparent"
            android:textColor="#ffffff"
            android:layout_marginLeft="20dp" />

        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            style="@style/myCustomTabLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@android:color/transparent"
            android:layout_below="@+id/appname_1"
            android:layout_alignParentEnd="true"
            android:layout_alignParentStart="false"
            android:layout_alignParentLeft="false"
            android:layout_alignParentRight="true"
            android:layout_alignParentBottom="false"
            android:layout_alignLeft="@+id/appname_1"
            app:tabGravity="fill"
            app:tabMode="scrollable"/>
    </RelativeLayout>

</android.support.v7.widget.Toolbar>

最后,我的活动

<style name="mainActivityTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="windowActionBar">false</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:textColorSecondary">@android:color/white</item>
    <!--We will be using the toolbar so no need to show ActionBar-->
    <item name="android:windowActionBar">false</item>

</style>

<style name="myCustomTabLayout" parent="Widget.Design.TabLayout">
    <item name="tabIndicatorColor">?attr/colorAccent</item>
    <item name="tabIndicatorHeight">2dp</item>
    <item name="tabSelectedTextColor">?android:textColorPrimary</item>
</style>

答案 1 :(得分:0)

感谢您深入回答OP。对于将来来到这里的人,如果你想在工具栏上显示后退按钮,它会将XCode/Preferences/Locations/Custom Paths中的所有后续视图推到一边大约50dp,即使在下面对齐时,即使使用{{ 1}}。因此,我刚刚去了透明的背景,并在他们身后留下了一个观点。