Xamarin - 如何使背景透明？

Question

我有一个黑色背景的简单页面。我想把它变成透明的，这样下面的页面就可以看到了，但却很模糊。

有人 建议:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         xmlns:local="clr-namespace:NameSpace"
         x:Class="NameSpace.MainPage"
         BackgroundColor="Transparent"> </ContentPage>

再来一个 建议。

<StackLayout VerticalOptions="End" HorizontalOptions="FillAndExpand"  BackgroundColor="#80000000" Opacity="0.5" HeightRequest="160"  Grid.Row="2" >

所以在平板电脑上都能用，但在移动设备上却不能用。谁能给我解释一下原因，或者建议我如何解决？先谢谢你

Answer 1

你可以使用 AbsoluteLayout 并设置 "浮动 "视图的透明度。

<AbsoluteLayout>

       <!--below view-->
        <StackLayout BackgroundColor="Red" AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">

            <Button Text="111111" />

        </StackLayout>


        <!--float view-->
        <StackLayout BackgroundColor="Gray" Opacity="0.5" AbsoluteLayout.LayoutBounds="0.5,0,1,0.5" AbsoluteLayout.LayoutFlags="All" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">

            

        </StackLayout>


    </AbsoluteLayout>

更新 "浮动 "视图

如果使用Navigation.NET来实现是不可能的，因为仅仅设置Page.NET的背景颜色是不够的。因为仅仅设置Page的backgroundColor是不够的。在ContentPage中有Rendering层。

作为一个变通办法，我们可以模拟一个导航（打开一个新页面）。

<AbsoluteLayout>

            <!--below view-->
            <StackLayout BackgroundColor="Red" AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">

                <Button Text="open new page"  Clicked="Button_Clicked_1"/>

            </StackLayout>


            <!--float view-->
            <StackLayout x:Name="FloatView" BackgroundColor="Gray" Opacity="0.5" AbsoluteLayout.LayoutBounds="1,1,0.01,1" AbsoluteLayout.LayoutFlags="All" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">

                <Label  Text="this is a transparent view"  HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" />

                <Button Text="Back" Clicked="Button_Clicked"/>

            </StackLayout>


        </AbsoluteLayout>

private void Button_Clicked_1(object sender, EventArgs e)
        {

            //show
            Device.BeginInvokeOnMainThread(async () =>
            {


                var xPosition = 0;
                var currentPosition = 0.9;
                while (currentPosition >xPosition)
                {
                    await Task.Delay(1);
                    currentPosition -= 0.04;

                    AbsoluteLayout.SetLayoutBounds(FloatView, new Rectangle(currentPosition,0, 1, 1));
                }

            });
        }

        private void Button_Clicked(object sender, EventArgs e)
        {
            //hide
            Device.BeginInvokeOnMainThread(async () =>
            {


                AbsoluteLayout.SetLayoutBounds(FloatView, new Rectangle(1, 0, 0.01, 0.01));


            });
        }