CODEWITHSUNDEEP
xamarinxamarin.forms
Saamer
Saamer

Reputation: 5119

Xamarin Forms Shapes inside SwipeView not working consistently

I created a solution (see code here) from a blank Xamarin Forms template, running the latest stable version of Xamarin Forms. I added the experimental Shapes and SwipeView as required into my native projects, and I have a list of rows just saying "Hello" inside a Collection View. I attempted to add a semicircle shape to the right swipe item's Grid, so it looks like the row has a rounded edge instead of rectangular shape.

But as you can see in the image below, the Shape just disappears after swiping to the right the second time. And occasionally the shape won't even appear in the row's swipe item.

Please note that the label always displays though, its just the shape going away. Also tested in Android & noticed the same behaviour. Do you know what the issue might be and if there's a work around?

Screen shot of inconsistent iOS behavior

Edit: Posted this and got a response to create an issue. Still looking for a workaround though

Upvotes: 0

Views: 348

Answers (1)

nevermore
nevermore

Reputation: 15816

You can use Frame with CornerRadius to achieve the result:

<StackLayout Orientation="Horizontal" Padding="0" Margin="0" Spacing="0">
    <Label
        Text="Left"
        HorizontalOptions="CenterAndExpand"
        VerticalOptions="CenterAndExpand" />
    <!--<Path HorizontalOptions="EndAndExpand" Fill="White" Stroke="White" Aspect="Fill" Data="m0.19956,-0.20844l14.43749,0l0,0c7.97347,0 14.43748,6.51981 14.43748,14.56254c0,8.04265 -6.464,14.5625 -14.43748,14.5625l-14.43749,0l0,-29.12504z" >
    <Path.RenderTransform>
            <RotateTransform CenterX="14.637"
                                CenterY="14.3541"
                                Angle="180" />
        </Path.RenderTransform>
    </Path>-->
    <Frame BackgroundColor="Yellow" CornerRadius="30" IsClippedToBounds="True" HeightRequest="30" WidthRequest="30" HorizontalOptions="End" Margin="0,0,-51,0">

    </Frame>

</StackLayout>

enter image description here

Upvotes: 1

Related Questions