feat(ios): improved shadow handling with background UI rework (#10374)

BREAKING CHANGES: 

`CSSShadow` was renamed into `ShadowCSSValues`
This commit is contained in:
Dimitris-Rafail Katsampas
2023-09-06 18:17:29 +03:00
committed by GitHub
parent a959a797df
commit 39eed526c1
32 changed files with 1433 additions and 858 deletions

View File

@@ -42,6 +42,14 @@ ScrollView {
border-left-width: 20;
}
.gradient {
background: linear-gradient(to bottom, orangered, green, lightblue);
}
.shadow {
box-shadow: inset 0 0 5 5 #000000;
}
.body {
font-size: 11;
}

View File

@@ -6,7 +6,7 @@
</Page.actionBar>
<StackLayout>
<StackLayout class="p-10" row="0">
<StackLayout class="p-10">
<Label text="Default style = scrolls out of container" class="body m-b-10" />
<ScrollView height="40">
<StackLayout>
@@ -17,7 +17,7 @@
</ScrollView>
</StackLayout>
<StackLayout class="p-10" row="1">
<StackLayout class="p-10">
<Label text="Adding border changes the height but fixes scrolling" textWrap="true" class="body m-b-10" />
<ScrollView class="bordered" height="40">
<StackLayout>
@@ -28,7 +28,7 @@
</ScrollView>
</StackLayout>
<StackLayout class="p-10" row="2">
<StackLayout class="p-10">
<Label text="border-radius" class="body m-b-10" />
<ScrollView class="bordered fixed-height border-radius">
<StackLayout>
@@ -39,7 +39,7 @@
</ScrollView>
</StackLayout>
<StackLayout class="p-10" row="2">
<StackLayout class="p-10">
<Label text="border-radius = weird" class="body m-b-10" />
<ScrollView class="bordered fixed-height border-radius-nonuniform">
<StackLayout>
@@ -50,7 +50,7 @@
</ScrollView>
</StackLayout>
<StackLayout class="p-10" row="3">
<StackLayout class="p-10">
<Label text="border-width = weird" class="body m-b-10" />
<ScrollView class="bordered-nonuniform fixed-height">
<StackLayout>
@@ -61,5 +61,38 @@
</ScrollView>
</StackLayout>
<StackLayout class="p-10">
<Label text="border-width = rounded weird" class="body m-b-10" />
<ScrollView class="bordered-nonuniform fixed-height border-radius">
<StackLayout>
<GridLayout width="30" height="30" backgroundColor="red" />
<GridLayout width="30" height="30" backgroundColor="yellow" />
<GridLayout width="30" height="30" backgroundColor="green" />
</StackLayout>
</ScrollView>
</StackLayout>
<StackLayout class="p-10">
<Label text="background = gradient" class="body m-b-10" />
<ScrollView class="fixed-height gradient">
<StackLayout>
<GridLayout width="30" height="30" backgroundColor="red" />
<GridLayout width="30" height="30" backgroundColor="yellow" />
<GridLayout width="30" height="30" backgroundColor="green" />
</StackLayout>
</ScrollView>
</StackLayout>
<StackLayout class="p-10">
<Label text="box-shadow" class="body m-b-10" />
<ScrollView class="fixed-height shadow">
<StackLayout>
<GridLayout width="30" height="30" backgroundColor="red" />
<GridLayout width="30" height="30" backgroundColor="yellow" />
<GridLayout width="30" height="30" backgroundColor="green" />
</StackLayout>
</ScrollView>
</StackLayout>
</StackLayout>
</Page>