Skip to content

Commit

Permalink
Ajustes Skeleton header y imagenes
Browse files Browse the repository at this point in the history
  • Loading branch information
AntonioBonillaHorus committed Jun 11, 2020
1 parent 9ccf35f commit cffd778
Show file tree
Hide file tree
Showing 19 changed files with 250 additions and 62 deletions.
Binary file added SkeletonExample/SkeletonExample.Android/Resources/drawable/img_1.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 5 additions & 1 deletion SkeletonExample/SkeletonExample.Android/SkeletonExample.Android.csproj
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@
<Reference Include="System.Numerics.Vectors" />
</ItemGroup>
<ItemGroup>
<PackageReference Include="Xamarin.Forms" Version="4.1.0.673156" />
<PackageReference Include="Xamarin.Forms" Version="4.6.0.800" />
<PackageReference Include="Xamarin.Android.Support.Design" Version="28.0.0.1" />
<PackageReference Include="Xamarin.Android.Support.v7.AppCompat" Version="28.0.0.1" />
<PackageReference Include="Xamarin.Android.Support.v4" Version="28.0.0.1" />
Expand Down Expand Up @@ -147,6 +147,10 @@
<SubType></SubType>
<Generator></Generator>
</AndroidResource>
<AndroidResource Include="Resources\drawable\img_1.jpg">
<SubType></SubType>
<Generator></Generator>
</AndroidResource>
</ItemGroup>
<ItemGroup>
<Folder Include="Resources\drawable-hdpi\" />
Expand Down
Binary file added SkeletonExample/SkeletonExample.iOS/Resources/health.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added SkeletonExample/SkeletonExample.iOS/Resources/health_fill.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added SkeletonExample/SkeletonExample.iOS/Resources/img_1.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added SkeletonExample/SkeletonExample.iOS/Resources/img_2.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added SkeletonExample/SkeletonExample.iOS/Resources/img_3.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added SkeletonExample/SkeletonExample.iOS/Resources/img_4.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added SkeletonExample/SkeletonExample.iOS/Resources/img_5.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added SkeletonExample/SkeletonExample.iOS/Resources/img_6.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified SkeletonExample/SkeletonExample.iOS/Resources/load.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 9 additions & 1 deletion SkeletonExample/SkeletonExample.iOS/SkeletonExample.iOS.csproj
View file
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,7 @@
<Reference Include="System.Numerics.Vectors" />
</ItemGroup>
<ItemGroup>
<PackageReference Include="Xamarin.Forms" Version="4.1.0.673156" />
<PackageReference Include="Xamarin.Forms" Version="4.6.0.800" />
<PackageReference Include="Xamarin.Essentials" Version="1.1.0" />
<PackageReference Include="Xamarin.FFImageLoading.Forms">
<Version>2.4.11.982</Version>
Expand Down Expand Up @@ -148,6 +148,14 @@
<BundleResource Include="Resources\back_gradient.png" />
<BundleResource Include="Resources\horus2.png" />
<BundleResource Include="Resources\ic_tab.png" />
<BundleResource Include="Resources\img_1.jpg" />
<BundleResource Include="Resources\health.png" />
<BundleResource Include="Resources\health_fill.png" />
<BundleResource Include="Resources\img_2.jpg" />
<BundleResource Include="Resources\img_3.jpg" />
<BundleResource Include="Resources\img_4.jpg" />
<BundleResource Include="Resources\img_5.jpg" />
<BundleResource Include="Resources\img_6.jpg" />
</ItemGroup>
<Import Project="$(MSBuildExtensionsPath)\Xamarin\iOS\Xamarin.iOS.CSharp.targets" />
</Project>
4 changes: 2 additions & 2 deletions SkeletonExample/SkeletonExample/App.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@
<Color x:Key="BlackColor">#0d1a26</Color>
<Color x:Key="RedColor">#e73d3b</Color>
<Color x:Key="DarkRedColor">#c92726</Color>
<Color x:Key="DarkGrayColor">#6f6f6e</Color>
<Color x:Key="GrayColor">#c6c6c5</Color>
<Color x:Key="DarkGrayColor">#828282</Color>
<Color x:Key="GrayColor">#E3E3E3</Color>
<Color x:Key="WhiteColor">#ffffff</Color>
</Application.Resources>
</Application>
4 changes: 2 additions & 2 deletions SkeletonExample/SkeletonExample/MainPage.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,6 @@
xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
android:TabbedPage.ToolbarPlacement="Bottom"
SelectedTabColor="{StaticResource RedColor}"
UnselectedTabColor="{StaticResource WhiteColor}"
BarBackgroundColor="{StaticResource BlackColor}">
UnselectedTabColor="{StaticResource DarkGrayColor}"
BarBackgroundColor="{StaticResource WhiteColor}">
</TabbedPage>
2 changes: 1 addition & 1 deletion SkeletonExample/SkeletonExample/Pages/BasePage.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,5 +8,5 @@
ios:Page.UseSafeArea="true"
mc:Ignorable="d"
IconImageSource="ic_tab.png"
BackgroundColor="{StaticResource DarkBlueColor}">
BackgroundColor="{StaticResource WhiteColor}">
</ContentPage>
205 changes: 172 additions & 33 deletions SkeletonExample/SkeletonExample/Pages/Page1.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,20 +6,90 @@
xmlns:sk="clr-namespace:Xamarin.Forms.Skeleton;assembly=Xamarin.Forms.Skeleton"
xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms"
x:Class="SkeletonExample.Pages.Page1"
Title="Skeleton">
Title="Skeleton"
xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core"
ios:Page.UseSafeArea="False">

<ContentPage.Resources>
<ResourceDictionary>
<DataTemplate x:Key="ItemTemplate">
<ViewCell>
<Frame HasShadow="False"
CornerRadius="16"
<StackLayout Orientation="Horizontal" Margin="30,10" Spacing="20">
<Frame HasShadow="False"
CornerRadius="20"
Padding="0"
WidthRequest="70"
IsClippedToBounds="True"
Margin="10,0,10,16"
BackgroundColor="{StaticResource BlueColor}"
BackgroundColor="{StaticResource WhiteColor}"
sk:Skeleton.IsParent="True"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.BackgroundColor="{StaticResource BlueColor}">
sk:Skeleton.BackgroundColor="{StaticResource GrayColor}">

<ffimageloading:CachedImage Source="{Binding Image}"
Aspect="AspectFill"/>
</Frame>

<StackLayout Margin="0,5">

<Frame BackgroundColor="Transparent"
HasShadow="False"
CornerRadius="5"
Padding="0"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.BackgroundColor="{StaticResource GrayColor}">

<Label Text="{Binding Title}"
TextColor="{StaticResource BlackColor}"
FontSize="20"
FontAttributes="Bold"
HorizontalOptions="Start"/>
</Frame>

<Frame BackgroundColor="Transparent"
HasShadow="False"
CornerRadius="5"
Padding="0"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.BackgroundColor="{StaticResource GrayColor}">

<Label
Text="{Binding Subtitle}"
TextColor="{StaticResource DarkGrayColor}"
FontSize="14"
HorizontalOptions="Start"/>
</Frame>

</StackLayout>


<StackLayout WidthRequest="26" HeightRequest="26" Margin="0,5" HorizontalOptions="EndAndExpand">
<Frame HasShadow="False"
CornerRadius="5"
Padding="0"
IsClippedToBounds="True"
BackgroundColor="Transparent"
HorizontalOptions="End"
sk:Skeleton.IsParent="True"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.BackgroundColor="{StaticResource GrayColor}">
<ffimageloading:CachedImage Source="health.png"
Aspect="AspectFill"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.Hide="True"/>
</Frame>
</StackLayout>

</StackLayout>

<!--<Frame HasShadow="False"
CornerRadius="20"
Padding="0"
IsClippedToBounds="True"
Margin="30,10"
BackgroundColor="{StaticResource WhiteColor}"
sk:Skeleton.IsParent="True"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.BackgroundColor="{StaticResource GrayColor}">
<AbsoluteLayout HeightRequest="200">
<ffimageloading:CachedImage Source="{Binding Image}"
Aspect="AspectFill"
Expand All @@ -31,62 +101,129 @@
AbsoluteLayout.LayoutBounds="0,0,1,1"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.Hide="True" />
<StackLayout Padding="16,12"
<StackLayout Padding="20"
Spacing="4"
Orientation="Horizontal"
AbsoluteLayout.LayoutFlags="PositionProportional,WidthProportional"
AbsoluteLayout.LayoutBounds="0,1,1,-1">
<Label Text="{Binding Title}"
<Frame BackgroundColor="Transparent"
HasShadow="False"
CornerRadius="5"
Padding="0"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.BackgroundColor="{StaticResource WhiteColor}">
<Label Text="{Binding Title}"
TextColor="{StaticResource RedColor}"
FontSize="Title"
FontAttributes="Bold"
HorizontalOptions="FillAndExpand"
/>
</Frame>
<Frame BackgroundColor="Transparent"
HasShadow="False"
CornerRadius="5"
Padding="0"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.BackgroundColor="{StaticResource DarkBlueColor}" />
sk:Skeleton.BackgroundColor="{StaticResource WhiteColor}">
<Label
Text="{Binding Subtitle}"
TextColor="{StaticResource WhiteColor}"
FontSize="Medium"
VerticalOptions="Center"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.BackgroundColor="{StaticResource DarkBlueColor}" />
VerticalOptions="Center"
HorizontalOptions="End"/>
</Frame>
</StackLayout>
</AbsoluteLayout>
</Frame>
-->



</ViewCell>
</DataTemplate>
</ResourceDictionary>
</ContentPage.Resources>
<ContentPage.Content>
<Grid ColumnSpacing="0"
RowSpacing="8">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="48" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="48" />
</Grid.ColumnDefinitions>
RowSpacing="0">
<Grid.RowDefinitions>
<RowDefinition Height="48" />
<RowDefinition Height="350" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<ffimageloading:CachedImage Grid.Column="1"
Source="horus.png"
HorizontalOptions="Center"
Aspect="AspectFit" />
<ContentView Grid.Column="2">
<ContentView.GestureRecognizers>
<TapGestureRecognizer Command="{Binding LoadCommand}" />
</ContentView.GestureRecognizers>
<ffimageloading:CachedImage Source="load.png"

<Frame HasShadow="False" CornerRadius="30" Margin="0,-30,0,0" IsClippedToBounds="True" Padding="0" BackgroundColor="Transparent"
sk:Skeleton.IsParent="True"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.BackgroundColor="{StaticResource GrayColor}"
sk:Skeleton.Animation="{sk:DefaultAnimation Fade}">

<AbsoluteLayout>
<ffimageloading:CachedImage AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0.5,0.5,1,1"
Source="img_1.jpg"
Aspect="AspectFill"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.Hide="True"/>
<ffimageloading:CachedImage Source="back_gradient.png"
Aspect="AspectFill"
AbsoluteLayout.LayoutFlags="All"
AbsoluteLayout.LayoutBounds="0,0,1,1"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.Hide="True" />

<Grid AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1"
x:Name="mainGrid">
<Grid.RowDefinitions>
<RowDefinition Height="48"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="48"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="48"/>
</Grid.ColumnDefinitions>

<ffimageloading:CachedImage Grid.Column="1" Grid.Row="0" Source="horus.png" Margin="0" HorizontalOptions="Center" Aspect="AspectFit" HeightRequest="36" sk:Skeleton.IsBusy="{Binding IsBusy}" sk:Skeleton.Hide="true"/>


<ContentView Grid.Column="2" Grid.Row="0">
<ContentView.GestureRecognizers>
<TapGestureRecognizer Command="{Binding LoadCommand}" />
</ContentView.GestureRecognizers>
<ffimageloading:CachedImage Source="load.png"
Aspect="AspectFit"
HeightRequest="32"
WidthRequest="32"
HorizontalOptions="Center"
VerticalOptions="Center" />
</ContentView>
<ListView Grid.Row="1"
Grid.ColumnSpan="3"
RowHeight="200"
VerticalOptions="Center"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.Hide="true"/>

</ContentView>
<StackLayout Grid.Column="0" Grid.Row="1" Grid.ColumnSpan="2" VerticalOptions="EndAndExpand">

<Frame BackgroundColor="Transparent" HasShadow="False" CornerRadius="5" Padding="0" sk:Skeleton.IsBusy="{Binding IsBusy}" sk:Skeleton.BackgroundColor="{StaticResource WhiteColor}" sk:Skeleton.Animation="{sk:DefaultAnimation Fade}">
<Label Text="Skeleton" TextColor="{StaticResource WhiteColor}" FontAttributes="Bold" FontSize="36"/>
</Frame>

<Frame BackgroundColor="Transparent" HasShadow="False" CornerRadius="5" Padding="0" sk:Skeleton.IsBusy="{Binding IsBusy}" sk:Skeleton.BackgroundColor="{StaticResource WhiteColor}" sk:Skeleton.Animation="{sk:DefaultAnimation Fade}">
<Label Text="By Horus" TextColor="{StaticResource WhiteColor}" FontAttributes="Bold" FontSize="20"/>
</Frame>
</StackLayout>
</Grid>
</AbsoluteLayout>
</Frame>

<ScrollView Grid.Row="1">
<StackLayout>
<Frame Margin="30,20,30,10" BackgroundColor="Transparent" HasShadow="False" CornerRadius="5" Padding="0" sk:Skeleton.IsBusy="{Binding IsBusy}" sk:Skeleton.BackgroundColor="{StaticResource GrayColor}" sk:Skeleton.Animation="{sk:DefaultAnimation Fade}">
<Label Text="Trending" TextColor="{StaticResource BlackColor}" FontAttributes="Bold" FontSize="24"/>
</Frame>

<ListView
RowHeight="90"
SeparatorVisibility="None"
SelectionMode="None"
VerticalOptions="FillAndExpand"
Expand All @@ -96,6 +233,8 @@
sk:Skeleton.IsParent="True"
sk:Skeleton.IsBusy="{Binding IsBusy}"
sk:Skeleton.Animation="{sk:DefaultAnimation Fade}" />
</StackLayout>
</ScrollView>
</Grid>
</ContentPage.Content>
</pages:BasePage>
13 changes: 13 additions & 0 deletions SkeletonExample/SkeletonExample/Pages/Page1.xaml.cs
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
using SkeletonExample.ViewModels;
using Xamarin.Forms;
using Xamarin.Forms.PlatformConfiguration.iOSSpecific;

namespace SkeletonExample.Pages
{
Expand All @@ -9,5 +11,16 @@ public Page1()
InitializeComponent();
this.BindingContext = new Page1ViewModel();
}

protected override void OnAppearing()
{
base.OnAppearing();
if (Device.RuntimePlatform.Equals(Device.iOS))
mainGrid.Margin = new Thickness(30, On<Xamarin.Forms.PlatformConfiguration.iOS>().SafeAreaInsets().Top+30, 30, 30);
else
mainGrid.Margin = new Thickness(30, 50, 30, 30);
}


}
}
2 changes: 1 addition & 1 deletion SkeletonExample/SkeletonExample/SkeletonExample.csproj
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
</PropertyGroup>

<ItemGroup>
<PackageReference Include="Xamarin.Forms" Version="4.1.0.673156" />
<PackageReference Include="Xamarin.Forms" Version="4.6.0.800" />
<PackageReference Include="Xamarin.Essentials" Version="1.1.0" />
<PackageReference Include="Xamarin.FFImageLoading.Forms" Version="2.4.11.982" />
<PackageReference Include="Plugin.MaterialDesignControls" Version="1.0.0" />
Expand Down
Loading

0 comments on commit cffd778

Please sign in to comment.