All Projects → jsuarezruiz → Xampane

jsuarezruiz / Xampane

Licence: MIT License
Xamarin Forms Layouts Library

Programming Languages

C#
18002 projects

Projects that are alternatives of or similar to Xampane

InteractiveAlert-Xamarin
Interactive alerts to Xamarin
Stars: ✭ 17 (-41.38%)
Mutual labels:  xamarin, xamarin-forms
CreditCardCheckout
Credit Card Checkout - A Xamarin.Forms UI Challenge
Stars: ✭ 69 (+137.93%)
Mutual labels:  xamarin, xamarin-forms
SimpleXamarinGraphQL
An iOS and Android app built in Xamarin.Forms demonstrating how to interact with GitHub's GraphQL API
Stars: ✭ 18 (-37.93%)
Mutual labels:  xamarin, xamarin-forms
Mutatio
Visual Studio for Mac add-in/extension for converting old PCLs to .NET Standard 2.0 targeting projects automatically.
Stars: ✭ 27 (-6.9%)
Mutual labels:  xamarin, xamarin-forms
ButtonCirclePlugin
Circle Buttons with icon for your Xamarin.Forms Applications
Stars: ✭ 96 (+231.03%)
Mutual labels:  xamarin, xamarin-forms
DarkModeSplashScreen
A sample app for iOS and Android written in Xamarin.Forms showing how to implement a Splash Page for Dark Mode
Stars: ✭ 28 (-3.45%)
Mutual labels:  xamarin, xamarin-forms
FicusUIChallenge
Xamarin.Forms UI Challenge Ficus IoT App
Stars: ✭ 38 (+31.03%)
Mutual labels:  xamarin, xamarin-forms
XamarinAzureChallenge
Create an iOS/Android app using Xamarin.Forms and connect it to a serverless Azure Function
Stars: ✭ 59 (+103.45%)
Mutual labels:  xamarin, xamarin-forms
Xamarin-ToDoApp
Todo App is a simple to do app developed with Xamarin
Stars: ✭ 74 (+155.17%)
Mutual labels:  xamarin, xamarin-forms
CouchDraw
A synchronized drawing app that utilizes Couchbase Sync Gateway and Xamarin to enable shared canvases.
Stars: ✭ 22 (-24.14%)
Mutual labels:  xamarin, xamarin-forms
Rox.Video.Xamarin
Rox Video Control for Xamarin.Forms
Stars: ✭ 17 (-41.38%)
Mutual labels:  xamarin, xamarin-forms
MyTasks
Xamarin.Forms goodlooking UI sample.
Stars: ✭ 74 (+155.17%)
Mutual labels:  xamarin, xamarin-forms
DevOpsExamples
A repo to show you how to use a private NuGet feed, such as Telerik, to restore packages in Azure DevOps, GitHub Actions, GitLab CI and AppCenter.
Stars: ✭ 16 (-44.83%)
Mutual labels:  xamarin, xamarin-forms
Xamarin.Forms.ARToolkit
Augmented Reality Toolkit for Xamarin Forms
Stars: ✭ 15 (-48.28%)
Mutual labels:  xamarin, xamarin-forms
XFFlipViewControl
An awesome animated Flippable View Control with Xamarin.Forms, or a Flipity Flippy Flippin' Flip View right here fellas! :D
Stars: ✭ 43 (+48.28%)
Mutual labels:  xamarin, xamarin-forms
XF-GradientButton
Gradient button for Xamarin.Forms
Stars: ✭ 25 (-13.79%)
Mutual labels:  xamarin, xamarin-forms
Xamarin.Forms.MaskedEntry
📝 Use mask in your Xamarin.Forms apps
Stars: ✭ 17 (-41.38%)
Mutual labels:  xamarin, xamarin-forms
Movies
Buy movie tickets in advance, find movie times, and more at "Movies".
Stars: ✭ 33 (+13.79%)
Mutual labels:  xamarin, xamarin-forms
MyCoffeeApp
Sample Xamarin.Forms app built live on in 101 series on YouTube
Stars: ✭ 119 (+310.34%)
Mutual labels:  xamarin, xamarin-forms
codemill.vmfirstnav
Xamarin.Forms ViewModel First Navigation Library
Stars: ✭ 22 (-24.14%)
Mutual labels:  xamarin, xamarin-forms

Xampane

Xamarin.Forms Layouts library.

CircularLayout

The CircularLayout is a simple Panel derivative that lays out its children in a circular arrangement. It has some useful properties to allow some customization like the Orientation (Clockwise or Counterclockwise).

<xampane:CircularLayout
    Orientation="Clockwise">
    <BoxView Color="Black" CornerRadius="6" WidthRequest="6" HeightRequest="6" />       
    <BoxView Color="Red" CornerRadius="12" WidthRequest="12" HeightRequest="12" xampane:CircularLayout.Angle="0" xampane:CircularLayout.Radius="120" />
    <BoxView Color="Green" CornerRadius="12" WidthRequest="12" HeightRequest="12" xampane:CircularLayout.Angle="10" xampane:CircularLayout.Radius="120" />
    <BoxView Color="Blue" CornerRadius="12" WidthRequest="12" HeightRequest="12" xampane:CircularLayout.Angle="20" xampane:CircularLayout.Radius="120" />
    <BoxView Color="Yellow" CornerRadius="12" WidthRequest="12" HeightRequest="12" xampane:CircularLayout.Angle="30" xampane:CircularLayout.Radius="120" />
    <Label Text="1" xampane:CircularLayout.Angle="30" xampane:CircularLayout.Radius="90" />
    <Label Text="2" xampane:CircularLayout.Angle="60" xampane:CircularLayout.Radius="90" />
    <Label Text="3" xampane:CircularLayout.Angle="90" xampane:CircularLayout.Radius="90" />
    <Label Text="4" xampane:CircularLayout.Angle="120" xampane:CircularLayout.Radius="90" />
    <Label Text="5" xampane:CircularLayout.Angle="150" xampane:CircularLayout.Radius="90" />
    <Label Text="6" xampane:CircularLayout.Angle="180" xampane:CircularLayout.Radius="90" />
    <Label Text="7" xampane:CircularLayout.Angle="210" xampane:CircularLayout.Radius="90" />
    <Label Text="8" xampane:CircularLayout.Angle="240" xampane:CircularLayout.Radius="90" />
    <Label Text="9" xampane:CircularLayout.Angle="270" xampane:CircularLayout.Radius="90" />
    <Label Text="10" xampane:CircularLayout.Angle="300" xampane:CircularLayout.Radius="90" />
    <Label Text="11" xampane:CircularLayout.Angle="330" xampane:CircularLayout.Radius="90" />
    <Label Text="12" xampane:CircularLayout.Angle="360" xampane:CircularLayout.Radius="90" />
</xampane:CircularLayout>

DockLayout

The DockLayout allows you to dock the child controls to the top, bottom, left or right. By default, the last control, if not given a specific dock position, will fill the remaining space. You can achieve the same with the Grid panel, but for the simpler situations, the DockLayout will be easier to use. Use the DockLayout whenever you need to dock one or several controls to one of the sides, like for dividing up the screen into specific areas.

<xampane:DockLayout
    LastChildFill="False">
    <Button xampane:DockLayout.Dock="Top" Text="Top" HeightRequest="50"/>
    <Button xampane:DockLayout.Dock="Bottom" Text="Bottom" HeightRequest="50"/>
    <Button xampane:DockLayout.Dock="Left" Text="Left" WidthRequest="60"/>
    <Button xampane:DockLayout.Dock="Left" Text="Left" WidthRequest="60"/>
    <Button xampane:DockLayout.Dock="Right" Text="Right" WidthRequest="80"/>
    <Button xampane:DockLayout.Dock="Right" Text="Right" WidthRequest="80"/>
</xampane:DockLayout>

HexLayout

A panel that arranges the elements in a honeycomb pattern.

<xampane:HexLayout
    RowCount="3"
    ColumnCount="3"
    Orientation="Vertical">
    <polygon:PolygonFrame xampane:HexLayout.Row="0" xampane:HexLayout.Column="1" OffsetAngle="90" BackgroundColor="Red"/>
    <polygon:PolygonFrame xampane:HexLayout.Row="0" xampane:HexLayout.Column="2" OffsetAngle="90" BackgroundColor="Green"/>
    <polygon:PolygonFrame xampane:HexLayout.Row="1" xampane:HexLayout.Column="0" OffsetAngle="90" BackgroundColor="Blue"/>
    <polygon:PolygonFrame xampane:HexLayout.Row="1" xampane:HexLayout.Column="1" OffsetAngle="90" BackgroundColor="Yellow"/>
    <polygon:PolygonFrame xampane:HexLayout.Row="1" xampane:HexLayout.Column="2" OffsetAngle="90" BackgroundColor="Orange"/>
    <polygon:PolygonFrame xampane:HexLayout.Row="2" xampane:HexLayout.Column="1" OffsetAngle="90" BackgroundColor="Purple"/>
    <polygon:PolygonFrame xampane:HexLayout.Row="2" xampane:HexLayout.Column="2" OffsetAngle="90" BackgroundColor="Pink"/>
</xampane:HexLayout>

UniformGrid

The UniformGrid is just like the Grid, with the possibility of multiple rows and columns, but with one important difference: All rows and columns will have the same size. Use this when you need the Grid behavior without the need to specify different sizes for the rows and columns.

<xampane:UniformGrid>
    <BoxView Color="Red" />
    <BoxView Color="Yellow" />
    <BoxView Color="Orange" />
    <BoxView Color="Purple" />
    <BoxView Color="Blue" />
    <BoxView Color="Green" />
    <BoxView Color="LightGreen" />
    <BoxView Color="Gray" />
    <BoxView Color="Pink" />
</xampane:UniformGrid>

WrapLayout

The WrapLayout will position each of its child controls next to the other, horizontally (default) or vertically, until there is no more room, where it will wrap to the next line and then continue. Use it when you want a vertical or horizontal collection controls that automatically wraps when there's no more room.

<xampane:WrapLayout 
    Orientation="Vertical"
    Spacing="6"
    HorizontalOptions="Center">
    <BoxView Color="Red" />
    <BoxView Color="Yellow" />
    <BoxView Color="Orange" />
    <BoxView Color="Purple" />
    <BoxView Color="Blue" />
    <BoxView Color="Green" />
    <BoxView Color="LightGreen" />
    <BoxView Color="Gray" />
    <BoxView Color="Pink" />
</xampane:WrapLayout>

Feedback

Please use GitHub issues for questions or comments.

Copyright and license

Code released under the MIT license.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].