CODEWITHSUNDEEP
c#xamarinxamarin.forms
Fayze
Fayze

Reputation: 151

Xamarin.Forms - absolutely position element at center in front of other content

Is it possible to place something like a AbsoluteLayout with opacity 0.5 and a background color in front of a StackLayout, so the StackLayout content is still visible in the background.

Something like this: 

<StackLayout>
    <StackLayout>
        <Label Text="This text needs to be visible through the AbsoluteLayout"></Label>
    </StackLayout>
    <AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Opacity="0.5" BackgroundColor="Blue">
        <ActivityIndicator Color="White" IsRunning="true" VerticalOptions="Center" WidthRequest="20" HeightRequest="20" />
    </AbsoluteLayout>
</StackLayout>

Except here the AbsoluteLayout blocks the other StackLayout, even with the opacity. Can I do anything to show them both, one over the other?

Upvotes: 0

Views: 1365

Answers (1)

Ivan Bukashkin
Ivan Bukashkin

Reputation: 694

<Grid>
    <StackLayout>
        <Label Text="This text needs to be visible through the AbsoluteLayout"></Label>
    </StackLayout>
    <AbsoluteLayout 
          HorizontalOptions="FillAndExpand" 
          VerticalOptions="FillAndExpand" 
          Opacity="0.5" 
          BackgroundColor="Blue" 
          InputTransparent="True">
        <ActivityIndicator Color="White" IsRunning="true" VerticalOptions="Center" WidthRequest="20" HeightRequest="20" />
    </AbsoluteLayout>
</Grid>


InputTransparent="True" will allow you click through AbsoluteLayout, and Grid will place StackLayout over AbsoluteLayout (overlapping).

Upvotes: 2

Related Questions