locked
Opacity not working RRS feed

  • Question

  • User356011 posted

    I want to set the Opacity for a BoxView:

    but the rendered color is a solid black:

    to see how it behaves I bound the opacity value to a Slider's Value:

    <StackLayout x:Name="stk">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition/>
                        <RowDefinition/>
                        <RowDefinition/>
                    </Grid.RowDefinitions>
                    <local:RadioButtonsGroup x:Name="rbs" SelectedValuePath="Id" DisplayMemberPath="Name" FontAttributes="Bold" FontFamily="Droid Sans Mono" FrontColor="#2061D8"/>
                    <Label HorizontalOptions="CenterAndExpand" FontSize="Large" TextColor="Black" Text="{Binding SelectedValue, Source={x:Reference rbs}}"/>
                    <BoxView HeightRequest="100" WidthRequest="150" BackgroundColor="Black" Opacity="{Binding Value, Source={x:Reference sd}}" HorizontalOptions="Center" VerticalOptions="Center"/>
                    <Slider x:Name="sd" Grid.Row="1"/>
                    <Label Text="{Binding Value, Source={x:Reference sd}}" Grid.Row="2"/>
                </Grid>
            </StackLayout>
    

    Tuesday, December 19, 2017 8:53 AM

All replies

  • User42522 posted

    @mshwf What is the Max Value of the slider? Have you tried setting the Box's Opacity to different values, without binding?

    Tuesday, December 19, 2017 4:11 PM
  • User364033 posted

    I'm seeing the same problem with code like this:

    <Grid> <BoxView BackgroundColor="Green" Opacity="0.1" /> <StackLayout Orientation="Horizontal"> <Label Text="Hello" /> <Label Text="World" /> </StackLayout> </Grid>

    It's not so much that Opacity doesn't work, as that it appears to be blending with black. So 0.1 is 10% green, 90% black.

    Oddly, if I remove the StackLayout and just leave a single Label, then Opacity on the BoxView works just as you'd expect. This is almost definitely a Xamarin.Forms bug.

    The workaround I applied for my somewhat more complex scenario was to use a converter that applies the alpha channel manually to the BackgroundColor property. That works fine.

    Sunday, December 24, 2017 2:50 AM
  • User356011 posted

    @mfeingol said: I'm seeing the same problem with code like this:

    <Grid> <BoxView BackgroundColor="Green" Opacity="0.1" /> <StackLayout Orientation="Horizontal"> <Label Text="Hello" /> <Label Text="World" /> </StackLayout> </Grid>

    It's not so much that Opacity doesn't work, as that it appears to be blending with black. So 0.1 is 10% green, 90% black.

    Oddly, if I remove the StackLayout and just leave a single Label, then Opacity on the BoxView works just as you'd expect. This is almost definitely a Xamarin.Forms bug.

    The workaround I applied for my somewhat more complex scenario was to use a converter that applies the alpha channel manually to the BackgroundColor property. That works fine.

    An even better workaround is using the 8-digit hex color format: #AC000000"

    Sunday, December 24, 2017 11:16 AM
  • User42522 posted

    @mshwf Is your project in PCL or in .NET Standard?

    Tuesday, December 26, 2017 5:00 PM
  • User356011 posted

    @ShantimohanElchuri said: @mshwf Is your project in PCL or in .NET Standard?

    PCL

    Wednesday, December 27, 2017 7:33 AM
  • User42522 posted

    @mfeingol said:

    It's not so much that Opacity doesn't work, as that it appears to be blending with black. So 0.1 is 10% green, 90% black.

    Oddly, if I remove the StackLayout and just leave a single Label, then Opacity on the BoxView works just as you'd expect. This is almost definitely a Xamarin.Forms bug.

    I suspect that the BackgroundColor and Opacity of the StackLayout is interfering with the Opacity of the Label.

    I asked about PCL / .NET Standard as I found the BoxView was not working on a .NET Standard project. I will have to dig more into this issue as I learn more and more day by day about .NET Standard.

    Wednesday, December 27, 2017 3:26 PM