a/CSSe/3 :clock3:help wantedin-progressinactivep/iOS 🍎t/bug :bug:up-for-grabs
仓库指标
- 星标
- (5,644 个星标)
- PR 合并指标
- (30 天内没有已合并 PR)
描述
Description
Frames on iOS have drop shadows on the contents of the frame.
Given a simple frame like this:
<Frame class="ColouredFrame" CornerRadius="10" >
<StackLayout Spacing="0">
<StackLayout Orientation="Horizontal" Margin="0, 5, 0, 20">
<Label class="RadioText" HorizontalOptions="StartAndExpand" VerticalTextAlignment="Start" FontAttributes="Bold">Please review and confirm that you agree to our terms and conditions before continuing.</Label>
<Button Text="View" Clicked="Button_Clicked" class="Primary" HorizontalOptions="End" VerticalOptions="Start" BorderRadius="8" WidthRequest="80"></Button>
</StackLayout>
<StackLayout Orientation="Horizontal" Margin="0, 5, 0, 5">
<Label class="RadioText" FontAttributes="Bold" VerticalTextAlignment="Center">I agree</Label>
<Switch x:Name="rbTerms" HorizontalOptions="StartAndExpand" />
<Button x:Name="btnContinue" StyleClass="Primary" Text="Continue" HorizontalOptions="Center" Clicked="ContinueButton_Clicked" BorderRadius="8" IsEnabled="False" WidthRequest="150"></Button>
</StackLayout>
</StackLayout>
</Frame>
and some CSS:
.ColouredFrame {
border-color: #57BABE;
background-color: #2257BABE;
padding: 10 10 10 10;
}
.ColouredFrame label {
color: #57BABE;
}
On iOS the shadow applies to everything within the Frame on Android, it only applies to the frame.
Expected Behavior
I would not expect the shadow to apply to the contents of the frame. At the very least iOS and Android should be consistent.
- Version with issue: Forms 4.0.0.94569-pre3
- Last known good version: N/A
Screenshots
Android:

iOS:

Workaround
Adding HasShadow='False' to the frame solves the issue.