How to create a semi-transparent frame in xaml?

I have made a BMI calculator based on a tutorial on Youtube. I added wallpaper to my app. I want to add a transparent frame to my background and all the controls would be put on that frame. I want to have full opacity for controls. I tried this code:

 <Frame BackgroundColor="Black"
               CornerRadius="10"
               HasShadow="False"
               Opacity="0.5"
               Margin="30">
    <FlexLayout Direction="Column"
                JustifyContent="SpaceEvenly"
                Padding="5">

        <StackLayout Opacity="1">
            <Label Text="قد شما چند سانتیمتر است؟"
               Style="{StaticResource TitleStyle}"/>
            <Label Text="{Binding Source={x:Reference HeightSlider},
            Path=Value,
            StringFormat='{0:F0} cm'}"
               Style="{StaticResource ValueStyle}"/>
            <Slider x:Name="HeightSlider"
                Maximum="220"
                Minimum="40"
                Value="{Binding Height}"/>
        </StackLayout>
        <StackLayout Opacity="1">
            <Label Text="وزن شما چند کیلوگرم است؟"
               Style="{StaticResource TitleStyle}"/>
            <Label Text="{Binding Source={x:Reference WeightSlider},
            Path=Value,
            StringFormat='{0:F0} kg'}"
               Style="{StaticResource ValueStyle}"/>
            <Slider x:Name="WeightSlider"
                Maximum="150"
                Minimum="5"
                Value="{Binding Weight}"/>
        </StackLayout>
        <StackLayout Opacity="1">
            <Label Text="شاخص توده بدنی شما:"
               Style="{StaticResource LabelStyle}"/>
            <Label Text="{Binding BMI}"
               Style="{StaticResource LabelStyle}"
               FontSize="48"/>
            <Label Text="{Binding Classification}"
               Style="{StaticResource LabelStyle}"
               FontSize="20"/>
        </StackLayout>
    </FlexLayout>
</Frame>

The problem is that opacity and padding of all controls have been inherited from the parent node. How can I have specific padding and full opacity for controls while keeping the transparency of the frame?

Solution

You could use BoxView instead and do not forget to set the same Margin in FlexLayout.

 <ContentPage.Resources>
    <ResourceDictionary>
        <Style x:Key="TitleStyle" TargetType="Label">
            <Setter Property="BackgroundColor" Value="Green"></Setter>
        </Style>
        <Style x:Key="ValueStyle" TargetType="Label">
            <Setter Property="BackgroundColor" Value="Red"></Setter>
        </Style>
        <Style x:Key="LabelStyle" TargetType="Label">
            <Setter Property="BackgroundColor" Value="Yellow"></Setter>
        </Style>
    </ResourceDictionary>
</ContentPage.Resources>
<ContentPage.Content>
    <Grid>
        <BoxView x:Name="frame"
           CornerRadius="10"                
           Opacity="0.5"
           Margin="30">

        </BoxView>
        <FlexLayout Margin="30" Direction="Column"
            JustifyContent="SpaceEvenly"
            Padding="5">

            <StackLayout Opacity="1">
                <Label Text="قد شما چند سانتیمتر است؟"
           Style="{StaticResource TitleStyle}"/>
                <Label Text="{Binding Source={x:Reference HeightSlider},
        Path=Value,
        StringFormat='{0:F0} cm'}"
           Style="{StaticResource ValueStyle}"/>
                <Slider x:Name="HeightSlider"
            Maximum="220"
            Minimum="40"
            Value="{Binding Height}"/>
            </StackLayout>
            <StackLayout Opacity="1">
                <Label Text="وزن شما چند کیلوگرم است؟"
           Style="{StaticResource TitleStyle}"/>
                <Label Text="{Binding Source={x:Reference WeightSlider},
        Path=Value,
        StringFormat='{0:F0} kg'}"
           Style="{StaticResource ValueStyle}"/>
                <Slider x:Name="WeightSlider"
            Maximum="150"
            Minimum="5"
            Value="{Binding Weight}"/>
            </StackLayout>
            <StackLayout Opacity="1">
                <Label Text="شاخص توده بدنی شما:"
           Style="{StaticResource LabelStyle}"/>
                <Label Text="{Binding BMI}"
           Style="{StaticResource LabelStyle}"
           FontSize="48"/>
                <Label Text="{Binding Classification}"
           Style="{StaticResource LabelStyle}"
           FontSize="20"/>
            </StackLayout>
        </FlexLayout>
    </Grid>
</ContentPage.Content>