{"id":13711081,"url":"https://github.com/wilsonvargas/ButtonCirclePlugin","last_synced_at":"2025-05-06T20:31:49.427Z","repository":{"id":144192085,"uuid":"96581856","full_name":"wilsonvargas/ButtonCirclePlugin","owner":"wilsonvargas","description":"Circle Buttons with icon for your Xamarin.Forms Applications ","archived":false,"fork":false,"pushed_at":"2020-05-01T04:05:52.000Z","size":1829,"stargazers_count":96,"open_issues_count":12,"forks_count":18,"subscribers_count":6,"default_branch":"master","last_synced_at":"2024-11-05T07:39:49.551Z","etag":null,"topics":["c-sharp","circle-button","nuget","pcl","plugin","xamarin","xamarin-forms","xamarin-plugin","xaml"],"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/wilsonvargas.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":null,"patreon":null,"open_collective":null,"ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"custom":"https://www.paypal.me/wilsondonations/5"}},"created_at":"2017-07-07T22:46:47.000Z","updated_at":"2024-06-07T09:58:41.000Z","dependencies_parsed_at":null,"dependency_job_id":"c7b0d538-5805-406f-a3f1-e7c4c4bab9f7","html_url":"https://github.com/wilsonvargas/ButtonCirclePlugin","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wilsonvargas%2FButtonCirclePlugin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wilsonvargas%2FButtonCirclePlugin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wilsonvargas%2FButtonCirclePlugin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wilsonvargas%2FButtonCirclePlugin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/wilsonvargas","download_url":"https://codeload.github.com/wilsonvargas/ButtonCirclePlugin/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":224528337,"owners_count":17326343,"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":["c-sharp","circle-button","nuget","pcl","plugin","xamarin","xamarin-forms","xamarin-plugin","xaml"],"created_at":"2024-08-02T23:01:04.230Z","updated_at":"2024-11-13T21:31:28.453Z","avatar_url":"https://github.com/wilsonvargas.png","language":"C#","funding_links":["https://www.paypal.me/wilsondonations/5"],"categories":["UI"],"sub_categories":[],"readme":"# Button Circle Control Plugin for Xamarin.Forms\n\nSimple but elegant way of display circle buttons with an icon in your Xamarin.Forms projects. \n\n[![Build status](https://ci.appveyor.com/api/projects/status/1yyib3ysj80mas1w?svg=true)](https://ci.appveyor.com/project/wilsonvargas/buttoncircleplugin) [![NuGet](https://buildstats.info/nuget/Plugins.Forms.ButtonCircle)](https://www.nuget.org/packages/Plugins.Forms.ButtonCircle/) [![Donate](https://img.shields.io/badge/Donate-PayPal-green.svg)](https://www.paypal.me/wilsondonations/5)\n\n![image](https://raw.githubusercontent.com/wilsonvargas/ButtonCirclePlugin/master/images/screenshots/image.png)\n\n#### Setup\n* Available on NuGet: [Plugins.Forms.ButtonCircle](https://www.nuget.org/packages/Plugins.Forms.ButtonCircle/)\n* Install into your PCL or .NET Standard project and Client projects.\n\n### Android\n\nIn your Android project call:\n\n```\nButtonCircleRenderer.Init();\n```\n\u003cimg src=\"https://raw.githubusercontent.com/wilsonvargas/ButtonCirclePlugin/master/images/screenshots/android.png\" \ndata-canonical-src=\"https://raw.githubusercontent.com/wilsonvargas/ButtonCirclePlugin/master/images/screenshots/android.png\"\n width=\"450\" height=\"480\" /\u003e\n\n### iOS\n\nIn your iOS project call:\n\n```\nButtonCircleRenderer.Init();\n```\n\nIn your iOS project add materialicons.ttf and fontawesome.ttf files to:\n\n```\nResources\n```\nYou can download the files here:\n\n[Material Design icons](https://github.com/wilsonvargas/ButtonCirclePlugin/blob/master/src/ButtonCircle/ButtonCircle.FormsPlugin.UWP/Assets/Fonts/materialicons.ttf)\n\n[FontAwesome](https://github.com/wilsonvargas/ButtonCirclePlugin/blob/master/src/ButtonCircle/ButtonCircle.FormsPlugin.UWP/Assets/Fonts/fontawesome.ttf)\n\nAnd add this key in your Info.plist\n\n```\n\u003ckey\u003eUIAppFonts\u003c/key\u003e\n    \u003carray\u003e\n      \u003cstring\u003ematerialicons.ttf\u003c/string\u003e\n      \u003cstring\u003efontawesome.ttf\u003c/string\u003e\n      \u003cstring\u003eionicons.ttf\u003c/string\u003e\n    \u003c/array\u003e\n```\n\n\u003cimg src=\"https://raw.githubusercontent.com/wilsonvargas/ButtonCirclePlugin/master/images/screenshots/ios.png\" \ndata-canonical-src=\"https://raw.githubusercontent.com/wilsonvargas/ButtonCirclePlugin/master/images/screenshots/ios.png\"\n width=\"480\" height=\"480\" /\u003e\n\n\n### UWP\n\nIn your UWP project add materialicons.ttf and fontawesome.ttf files to:\n\n```\nAssets/Fonts\n```\nYou can download the files here:\n\n[Material Design icons](https://github.com/wilsonvargas/ButtonCirclePlugin/blob/master/src/ButtonCircle/ButtonCircle.FormsPlugin.UWP/Assets/Fonts/materialicons.ttf)\n\n[FontAwesome](https://github.com/wilsonvargas/ButtonCirclePlugin/blob/master/src/ButtonCircle/ButtonCircle.FormsPlugin.UWP/Assets/Fonts/fontawesome.ttf)\n\n[Ionic](https://github.com/wilsonvargas/ButtonCirclePlugin/blob/master/src/ButtonCircle/ButtonCircle.FormsPlugin.UWP/Assets/Fonts/ionicons.ttf)\n\nAlso call Init method:\n\n```\nButtonCircleRenderer.Init();\n```\nYou must do this AFTER you call Xamarin.Forms.Init();\n\n\u003e **Note:** On UWP, the button's fill color on hover will be a lighter shade of the background color set on the CircleButton, unless it is transparent (which will be the assumed default if no BackgroundColor is explicitly set) in which case the BorderColor will be used.\n\n![Image](https://raw.githubusercontent.com/wilsonvargas/ButtonCirclePlugin/master/images/screenshots/windows.png)\n\n\n**Platform Support**\n\n|Platform|Supported|Version|\n| ------------------- | :-----------: | :------------------: |\n|Xamarin.iOS|Yes|iOS 7+|\n|Xamarin.Android|Yes|API 14+|\n|Windows 10 UWP|Yes|Build 105086+\n|Xamarin.Mac|No||\n\n#### List of icons\nYou can see name of icons\nfor FontAwesome [here](https://github.com/wilsonvargas/ButtonCirclePlugin/blob/master/src/ButtonCircle/ButtonCircle.FormsPlugin.Abstractions/FontAwesome/FontAwesomeCollection.cs)\nand for Material design icon [here](https://github.com/wilsonvargas/ButtonCirclePlugin/blob/master/src/ButtonCircle/ButtonCircle.FormsPlugin.Abstractions/Material/MaterialCollection.cs)\n\n#### Usage\nInstead of using an Button simply use a CircleButton instead!\n\nYou **MUST** set the width \u0026 height requests to the same value. Here is a sample:\n```\nnew ButtonImage\n{\n  BorderColor = Color.Black,\n  BorderThickness = 5,\n  HeightRequest = 150,\n  WidthRequest = 150,\n  HorizontalOptions = LayoutOptions.Center,\n  FontIcon = Fonts.Material\n  Icon = \"md-add\"\n}\n```\n\n**XAML:**\n\nFirst add the xmlns namespace:\n```xml\nxmlns:local=\"clr-namespace:ButtonCircle.FormsPlugin.Abstractions;assembly=ButtonCircle.FormsPlugin.Abstractions\"\n```\n\nThen add the xaml:\n\n```xml\n\u003clocal:CircleButton \n        FontIcon=\"Material\"\n        Icon=\"md-directions-bike\" \n        FontSize=\"30\" TextColor=\"Black\" \n        HeightRequest=\"70\" WidthRequest=\"70\" \n        BorderThickness=\"5\" BorderColor=\"Black\" \n        BackgroundColor=\"#DCDCDC\"\u003e\n\u003c/local:CircleButton\u003e\n```\n\n\u003e If you see the replacement character (�) appear instead of the desired icon, make sure that you have followed the setup instructions above and that you have supplied the correct text key for the \"Icon\" property.\n\n#### License\nLicensed under MIT, see license file\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwilsonvargas%2FButtonCirclePlugin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwilsonvargas%2FButtonCirclePlugin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwilsonvargas%2FButtonCirclePlugin/lists"}