Xamarin.Android的透明重叠工具栏

时间:2018-07-11 20:59:37

标签: android xamarin.android android-toolbar

我试图在Xamarin.Android上使工具栏透明和重叠,但是每次我将工具栏的颜色设置为透明时,它就会变成白色,但仍然无法使其重叠。 我已经完成了几个关于堆栈溢出的类似问题,但对我没有任何帮助。这是我的风格。

<style name="MainTheme" parent="MainTheme.Base">
  </style>
  <style name="MainTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
    <item name="colorPrimary">#0B6623</item>
    <item name="colorPrimaryDark">#1f3826</item>
    <item name="colorAccent">#ffe135</item>
    <item name="windowActionModeOverlay">true</item>
    
    <item name="windowActionBarOverlay">true</item>
    <item name="android:windowActionBarOverlay">true</item>

    <item name="android:datePickerDialogTheme">@style/AppCompatDialogStyle</item>
  </style>
  
  <style name="CustomActionBar" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="android:windowActionBarOverlay">true</item>
    <item name="windowActionBarOverlay">true</item>
      <item name="background">@color/transparentBlack</item>
  </style>

  <style name="AppCompatDialogStyle" parent="Theme.AppCompat.Light.Dialog">
    <item name="colorAccent">#FF4081</item>
  </style>

这是我的工具栏代码:

<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/transparentBlack"
    android:theme="@style/CustomActionBar"/>

我使用C#代码使状态栏变为半透明:

private void MakeStatusBarTranslucent(bool makeTranslucent)
    {
        if (makeTranslucent)
        {
            SetStatusBarColor(Android.Graphics.Color.Transparent);

            if (Build.VERSION.SdkInt >= BuildVersionCodes.Lollipop)
            {
                Window.DecorView.SystemUiVisibility = (StatusBarVisibility)(SystemUiFlags.LayoutFullscreen | SystemUiFlags.LayoutStable);
            }
        }
        else
        {
            using (var value = new TypedValue())
            {
                if (Theme.ResolveAttribute(Resource.Attribute.colorPrimaryDark, value, true))
                {
                    var color = new Android.Graphics.Color(value.Data);
                    SetStatusBarColor(color);
                }
            }

            if (Build.VERSION.SdkInt >= BuildVersionCodes.Lollipop)
            {
                Window.DecorView.SystemUiVisibility = StatusBarVisibility.Visible;
            }
        }
    }

1 个答案:

答案 0 :(得分:0)

就我而言,您需要为“导航”页面有一个自定义渲染器(假设您使用的是 NavigationPage ),并覆盖其 OnLayout 方法。

Droid示例:-

[assembly: ExportRenderer(typeof(NavigationNoToolbarPage), typeof(CareMe.Droid.Renderer.NavigationNoToolbarPageRenderer))]
namespace CareMe.Droid.Renderer
{
    public class NavigationNoToolbarPageRenderer : NavigationPageRenderer
    {
        IPageController PageController => Element as IPageController;
        NavigationNoToolbarPage CustomNavigationPage => Element as NavigationNoToolbarPage;

        public NavigationNoToolbarPageRenderer(Context context) : base(context)
        {
        }

        protected override void OnLayout(bool changed, int l, int t, int r, int b)
        {
            CustomNavigationPage.IgnoreLayoutChange = true;
            base.OnLayout(changed, l, t, r, b);
            CustomNavigationPage.IgnoreLayoutChange = false;

            var containerHeight = b - t;

            PageController.ContainerArea = new Rectangle(0, 0, Context.FromPixels(r - l), Context.FromPixels(containerHeight));

            for (var i = 0; i < ChildCount; i++)
            {
                var child = GetChildAt(i);

                if (child is Android.Support.V7.Widget.Toolbar)
                {
                    var temp = child as Android.Support.V7.Widget.Toolbar;
                    temp.SetBackgroundColor(Android.Graphics.Color.Transparent);
                }

                child.Layout(0, 0, r, b);
            }
        }
    }
}

请注意,这里 NavigationNoToolbarPage 是自 NavigationPage 类派生的自定义导航页面。

public class NavigationNoToolbarPage: NavigationPage
    {
        public bool IgnoreLayoutChange { get; set; } = false;

        protected override void OnSizeAllocated(double width, double height)
        {
            if (!IgnoreLayoutChange)
                base.OnSizeAllocated(width, height);
        }

        public NavigationNoToolbarPage(Page page): base(page)
        {

        }
    }

参考: https://xamgirl.com/transparent-navigation-bar-in-xamarin-forms/

干杯! 埃兰达