{"id":20272905,"url":"https://github.com/muak/aiforms.layouts","last_synced_at":"2025-04-11T04:42:37.446Z","repository":{"id":65390077,"uuid":"81563986","full_name":"muak/AiForms.Layouts","owner":"muak","description":"AiForms.Layouts (WrapLayout) for Xamarin.Forms","archived":false,"fork":false,"pushed_at":"2020-06-25T09:39:41.000Z","size":2954,"stargazers_count":93,"open_issues_count":3,"forks_count":13,"subscribers_count":11,"default_branch":"master","last_synced_at":"2025-04-11T04:42:30.883Z","etag":null,"topics":["repeatable-stacklayout","wrap-layout","wrap-panel","xamarin","xamarin-forms"],"latest_commit_sha":null,"homepage":"","language":"C#","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/muak.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-02-10T12:38:22.000Z","updated_at":"2024-11-25T06:56:27.000Z","dependencies_parsed_at":"2023-02-24T19:00:23.386Z","dependency_job_id":null,"html_url":"https://github.com/muak/AiForms.Layouts","commit_stats":null,"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/muak%2FAiForms.Layouts","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/muak%2FAiForms.Layouts/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/muak%2FAiForms.Layouts/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/muak%2FAiForms.Layouts/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/muak","download_url":"https://codeload.github.com/muak/AiForms.Layouts/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248345281,"owners_count":21088242,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["repeatable-stacklayout","wrap-layout","wrap-panel","xamarin","xamarin-forms"],"created_at":"2024-11-14T12:47:26.960Z","updated_at":"2025-04-11T04:42:37.425Z","avatar_url":"https://github.com/muak.png","language":"C#","funding_links":[],"categories":[],"sub_categories":[],"readme":"# AiForms.Layouts for Xamarin.Forms\n\nThis is a collection of  Xamarin.Forms custom layouts\n\n## Referenced source code\n\n* https://forums.xamarin.com/discussion/comment/57486/#Comment_57486\n* https://forums.xamarin.com/discussion/21635/xforms-needs-an-itemscontrol/p2\n\n## Features\n\n* [RepeatableFlex](#repeatableflex)\n* [WrapLayout](#wraplayout)\n* [RepeatableWrapLayout](#repeatablewraplayout)\n* [RepeatableStack](#repeatablestack)\n\n\u003cimg src=\"images/1.png\" width=200 /\u003e\u003cimg src=\"images/2.png\" width=200 /\u003e\u003cimg src=\"images/3.png\" width=200 /\u003e\n\n## Demo\n\nhttps://twitter.com/muak_x/status/830061279330996224\n\n## Nuget Installation\n\n[https://www.nuget.org/packages/AiForms.Layouts/](https://www.nuget.org/packages/AiForms.Layouts/)\n\n```bash\nInstall-Package AiForms.Layouts\n```\n\nYou need to install this package to .NETStandard / PCL project and **each platform project**.\n\n### iOS\n\nIf you don't use XamlCompilationOptions.Compile, need to write following code in AppDelegate.cs; Otherwise needn't.\n\n```cs\npublic override bool FinishedLaunching(UIApplication app, NSDictionary options) {\n    global::Xamarin.Forms.Forms.Init();\n\n    AiForms.Layouts.LayoutsInit.Init();  //need to write here\n\n    LoadApplication(new App(new iOSInitializer()));\n\n    return base.FinishedLaunching(app, options);\n}\n```\n\n## RepeatableFlex\n\nThis layout is a FlexLayout corresponding to DataTemplate and DataTemplateSelector.\n\n### Parameters\n\n* ItemsSource\n* ItemTemplate\n\n### How to write with Xaml\n\n```xml\n\u003cScrollView Orientation=\"Virtical\" HeightRequest=\"86\"\u003e\n\u003cal:RepeatableFlex Direction=\"Row\" Wrap=\"Wrap\" AlignItems=\"Start\" JustifyContent=\"Start\" ItemsSource=\"{Binding BoxList}\"\u003e\n\t\u003cal:RepeatableFlex.ItemTemplate\u003e\n\t\t\u003cDataTemplate\u003e\n\t\t\t\u003cContentView BackgroundColor=\"{Binding Color}\" WidthRequest=\"80\" HeightRequest=\"80\" Padding=\"3\" /\u003e\n\t\t\u003c/DataTemplate\u003e\n\t\u003c/al:RepeatableFlex.ItemTemplate\u003e\n\u003c/al:RepeatableFlex\u003e\n\u003c/ScrollView\u003e\n```\n\n## WrapLayout\n\nThis Layout performs wrapping on the boundaries.\n\n_By Flex Layout having come, there is seldom opportunity using this layout. But it can be used when you want to arrange uniformly each items depending on screen width or make it square._\n\n### Parameters\n\n* Spacing\n    * added between elements\n* UniformColumns\n    * number for uniform child width (default 0)\n    * If it is 0,it will obey WidthRequest value.\n    * If it is more than 0 ,a child width will be  width which divide parent width by this number.\n* IsSquare\n    * If it is true,it make item height equal to item width when UniformColums \u003e 0 (default false)\n\n### How to write with Xaml\n\n```xml\n\u003cContentPage xmlns=\"http://xamarin.com/schemas/2014/forms\"\n\t\txmlns:x=\"http://schemas.microsoft.com/winfx/2009/xaml\"\n\t\txmlns:l=\"clr-namespace:AiForms.Layouts;assembly=AiForms.Layouts\"\n\t\tx:Class=\"Sample.Views.MainPage\"\u003e\n    \u003cStackLayout\u003e\n        \u003cl:WrapLayout Spacing=\"4\" UniformColumns=\"3\" IsSquare=\"true\" HorizontalOptions=\"FillAndExpand\"\u003e\n    \t\t\u003cBoxView Color=\"Red\" /\u003e\n            \u003cBoxView Color=\"Blue\" /\u003e\n            \u003cBoxView Color=\"Green\" /\u003e\n            \u003cBoxView Color=\"Black\" /\u003e\n            \u003cBoxView Color=\"Yellow\" /\u003e\n        \u003c/l:WrapLayout\u003e\n    \u003c/StackLayout\u003e\n\u003c/ContentPage\u003e\n```\n\n## RepeatableWrapLayout\n\nThis Layout is WrapLayout corresponding to DataTemplate and DataTemplateSelector.\n\n\u003e If a lot of items are arranged, you should use [CollectionView](https://github.com/muak/AiForms.CollectionView) that can recycle items.\n\n### Parameters\n\n* ItemTapCommandProperty\n    * Command invoked when a item is tapped.\n* ItemsSource\n* ItemTemplate\n\n### How to write with Xaml\n\n```xml\n\u003cContentPage xmlns=\"http://xamarin.com/schemas/2014/forms\"\n\t\txmlns:x=\"http://schemas.microsoft.com/winfx/2009/xaml\"\n\t\txmlns:l=\"clr-namespace:AiForms.Layouts;assembly=AiForms.Layouts\"\n\t\tx:Class=\"Sample.Views.MainPage\"\u003e\n\t\u003cStackLayout\u003e\n\t\t\u003cScrollView HorizontalOptions=\"FillAndExpand\"\u003e\n\t\t\t\u003cl:RepeatableWrapLayout\n\t\t\t\tItemTapCommand=\"{Binding TapCommand}\"\n\t\t\t\tItemsSource=\"{Binding BoxList}\"\n\t\t\t\tSpacing=\"3\" UniformColumns=\"{Binding UniformColumns}\"\n\t\t\t\tIsSquare=\"{Binding IsSquare}\" \u003e\n\t\t\t\t\u003cl:RepeatableWrapLayout.ItemTemplate\u003e\n\t\t\t\t\t\u003cDataTemplate\u003e\n\t\t\t\t\t\t\u003cStackLayout BackgroundColor=\"{Binding Color}\" \u003e\n\t\t\t\t\t\t\t\u003cLabel\n\t\t\t\t\t\t\t\tVerticalTextAlignment=\"Center\" HorizontalTextAlignment=\"Center\"\n\t\t\t\t\t\t\t\tText=\"{Binding Name}\"  /\u003e\n\t\t\t\t\t\t\u003c/StackLayout\u003e\n\t\t\t\t\t\u003c/DataTemplate\u003e\n\t\t\t\t\u003c/l:RepeatableWrapLayout.ItemTemplate\u003e\n\t\t\t\u003c/l:RepeatableWrapLayout\u003e\n\t\t\u003c/ScrollView\u003e\n\t\u003c/StackLayout\u003e\n\u003c/ContentPage\u003e\n```\n\n## RepeatableStack\n\nThis layout is a StackLayout corresponding to DataTemplate and DataTemplateSelector.\n\n### Parameters\n\n* ItemsSource\n* ItemTemplate\n\n### How to write with Xaml\n\n```xml\n\u003c!-- Horizontal --\u003e\n\u003cScrollView Orientation=\"Horizontal\" HeightRequest=\"86\"\u003e\n\u003cal:RepeatableStack Orientation=\"Horizontal\" ItemsSource=\"{Binding BoxList}\" HeightRequest=\"86\"\u003e\n\t\u003cal:RepeatableStack.ItemTemplate\u003e\n\t\t\u003cDataTemplate\u003e\n\t\t\t\u003cContentView BackgroundColor=\"{Binding Color}\" WidthRequest=\"80\" HeightRequest=\"80\" Padding=\"3\" /\u003e\n\t\t\u003c/DataTemplate\u003e\n\t\u003c/al:RepeatableStack.ItemTemplate\u003e\n\u003c/al:RepeatableStack\u003e\n\u003c/ScrollView\u003e\n\n\u003c!-- Vertical --\u003e\n\u003cScrollView\u003e\n\u003cal:RepeatableStack Orientation=\"Vertical\" ItemsSource=\"{Binding BoxList}\"\u003e\n\t\u003cal:RepeatableStack.ItemTemplate\u003e\n\t\t\u003cDataTemplate\u003e\n\t\t\t\u003cContentView BackgroundColor=\"{Binding Color}\" WidthRequest=\"80\" HeightRequest=\"80\" Padding=\"3\" /\u003e\n\t\t\u003c/DataTemplate\u003e\n\t\u003c/al:RepeatableStack.ItemTemplate\u003e\n\u003c/al:RepeatableStack\u003e\n\u003c/ScrollView\u003e\n```\n## Contributors\n\n* [predalpha](https://github.com/predalpha)\n\n\n## License\n\nMIT Licensed.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmuak%2Faiforms.layouts","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmuak%2Faiforms.layouts","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmuak%2Faiforms.layouts/lists"}