Skip to content

Commit

Permalink
Merge pull request #180 from Strypper/174-bug-create-a-card-with-a-frame
Browse files Browse the repository at this point in the history 
Fix Document
  • Loading branch information
@Strypper
Strypper authored Mar 17, 2024
2 parents 02be2c2 + e7fc112 commit c9d9cb2
Show file tree
Hide file tree
Showing 2 changed files with 52 additions and 47 deletions.
75 changes: 38 additions & 37 deletions src/Features/Gallery/Pages/BuiltIn/Controls/Frame/FramePage.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,8 @@
<ScrollView>
<VerticalStackLayout Spacing="20">
<Border Padding="20" StrokeShape="RoundRectangle 4">
<Label FontSize="Subtitle" Text="{x:StaticResource ControlInfo}" />
<Label FontSize="Subtitle"
Text="{x:StaticResource ControlInfo}" />
</Border>
<Border Padding="20" StrokeShape="RoundRectangle 4">
<CollectionView
Expand All @@ -82,7 +83,8 @@

<Border Padding="20" StrokeShape="RoundRectangle 4">
<VerticalStackLayout Spacing="20">
<Label Style="{x:StaticResource DocumentSectionTitleStyle}" Text="Create a Frame" />
<Label Style="{x:StaticResource DocumentSectionTitleStyle}"
Text="Create a Frame" />
<Label Text="A Frame object typically wraps another control, such as a Label:" />
<Frame>
<Label Text="Frame wrapped around a Label" TextColor="White" />
Expand All @@ -106,26 +108,25 @@

<Border Padding="20" StrokeShape="RoundRectangle 4">
<VerticalStackLayout Spacing="20">
<Label Style="{x:StaticResource DocumentSectionTitleStyle}" Text="Create a card with a Frame" />
<Label Style="{x:StaticResource DocumentSectionTitleStyle}"
Text="Create a card with a Frame" />
<Label Text="The following XAML shows how to create a card with a Frame:" />
<Frame
Padding="10"
BackgroundColor="White"
BorderColor="Gray"
CornerRadius="8"
HeightRequest="150"
WidthRequest="200">
<Frame Padding="10"
BackgroundColor="White"
BorderColor="Gray"
CornerRadius="8"
HeightRequest="150"
WidthRequest="200">
<StackLayout>
<Label
FontAttributes="Bold"
FontSize="14"
Text="Card Example"
TextColor="Black" />
<BoxView
HeightRequest="2"
HorizontalOptions="Fill"
Color="Gray" />
<Label Text="Frames can wrap more complex layouts to create more complex UI components, such as this card!" TextColor="Black" />
<Label FontAttributes="Bold"
FontSize="14"
Text="Card Example"
TextColor="Black" />
<BoxView HeightRequest="2"
HorizontalOptions="Fill"
Color="Gray" />
<Label Text="Frames can wrap more complex layouts to create more complex UI components, such as this card!"
TextColor="Black" />
</StackLayout>
</Frame>
<app:SourceCodeExpander Code="{x:Binding CreateACardWithAFrameXamlCode}" />
Expand All @@ -134,23 +135,23 @@

<Border Padding="20" StrokeShape="RoundRectangle 4">
<VerticalStackLayout Spacing="20">
<Label Style="{x:StaticResource DocumentSectionTitleStyle}" Text="Round elements" />
<CollectionView ItemsSource="{x:StaticResource PropertiesItemsSource2}" Style="{x:StaticResource PropertiesListStyle}" />
<Frame
Padding="20"
BorderColor="Black"
CornerRadius="60"
HeightRequest="120"
HorizontalOptions="Center"
IsClippedToBounds="True"
VerticalOptions="Center"
WidthRequest="120">
<Image
HeightRequest="80"
HorizontalOptions="Center"
Source="{x:Binding ControlInformation.ControlIcon}"
VerticalOptions="Center"
WidthRequest="80" />
<Label Style="{x:StaticResource DocumentSectionTitleStyle}"
Text="Round elements" />
<CollectionView ItemsSource="{x:StaticResource PropertiesItemsSource2}"
Style="{x:StaticResource PropertiesListStyle}" />
<Frame Padding="20"
BorderColor="Black"
CornerRadius="60"
HeightRequest="120"
WidthRequest="120"
HorizontalOptions="Center"
VerticalOptions="Center"
IsClippedToBounds="True">
<Image HeightRequest="80"
WidthRequest="80"
HorizontalOptions="Center"
VerticalOptions="Center"
Source="{x:Binding ControlInformation.ControlIcon}"/>
</Frame>
<app:SourceCodeExpander Code="{x:Binding RoundElementsXamlCode}" />
</VerticalStackLayout>
Expand Down
24 changes: 14 additions & 10 deletions src/Features/Gallery/Pages/BuiltIn/Controls/Frame/FramePageViewModel.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,35 +32,39 @@ IAppNavigator appNavigator
[ObservableProperty]
string createACardWithAFrameXamlCode =
"<Frame Padding=\"10\"\r\n" +
" BorderColor=\"Gray\"\r\n" +
" BackgroundColor=\"White\"\r\n" +
" CornerRadius=\"8\">\r\n" +
" BorderColor=\"Gray\"\r\n" +
" CornerRadius=\"8\"\r\n" +
" HeightRequest=\"150\"\r\n" +
" WidthRequest=\"200\">\r\n" +
" <StackLayout>\r\n" +
" <Label FontAttributes=\"Bold\"\r\n" +
" FontSize=\"14\"\r\n" +
" Text=\"Card Example\" />\r\n" +
" Text=\"Card Example\"\r\n" +
" TextColor=\"Black\" />\r\n" +
" <BoxView HeightRequest=\"2\"\r\n" +
" HorizontalOptions=\"Fill\"\r\n" +
" Color=\"Gray\" />\r\n" +
" <Label Text=\"Frames can wrap more complex layouts to create more complex UI components, such as this card!\" />\r\n" +
" <Label Text=\"Frames can wrap more complex layouts to create more complex UI components, such as this card!\"\r\n" +
" TextColor=\"Black\" />\r\n" +
" </StackLayout>\r\n" +
"</Frame>";

[ObservableProperty]
string roundElementsXamlCode =
"<Frame BorderColor=\"Black\"\r\n" +
" Padding=\"20\"\r\n" +
"<Frame Padding=\"20\"\r\n" +
" BorderColor=\"Black\"\r\n" +
" CornerRadius=\"60\"\r\n" +
" HeightRequest=\"120\"\r\n" +
" WidthRequest=\"120\"\r\n" +
" HorizontalOptions=\"Center\"\r\n" +
" VerticalOptions=\"Center\"\r\n" +
" IsClippedToBounds=\"True\">\r\n" +
" <Image VerticalOptions=\"Center\"\r\n" +
" <Image HeightRequest=\"80\"\r\n" +
" WidthRequest=\"80\" \r\n" +
" HorizontalOptions=\"Center\"\r\n" +
" HeightRequest=\"80\"\r\n" +
" WidthRequest=\"80\"\r\n" +
" Source=\"{x:Binding ControlInformation.ControlIcon}\" />\r\n" +
" VerticalOptions=\"Center\"\r\n" +
" Source=\"{x:Binding ControlInformation.ControlIcon}\"/>\r\n" +
"</Frame>";

#endregion
Expand Down

0 comments on commit c9d9cb2

Please sign in to comment.