Xamarin Magic Code Snippets
Speed-up your development of Magic Gradients with Snippets
This blog post is a part of Louis Matos’s Xamarin Month, where this months topic is Code Snippets. For more information take a look at this blog and see the list of all the other authors who are participating. There you can find a lot of cool snippets to speed-up your development process and give you some satisfaction in writing your daily code.
It’s so many awesome snippets already there, so… what can I add from my side? I think we need some Magic in this Xamarin Month. All snippets will be available at my Magic-Xamarin-Snippets code repository on GitHub and you may download it => import into your IDE(VS 2019 for now only) and just use it.
But what are Magic Gradients? — You will find all answers under this Microsoft Blog Post:
Gradients build in Xaml — Linear
Basically, when someone thinks about gradients — he imagines a two or four colour Linear Gradients, so let’s begin from them. Also quite popular becomes Linear Gradients Built-in Xaml Code. And this is really surprised me, but ok… If you love to write Gradients in Xaml what I may tell you? — Just use those snippets to speed up yourself.
**mglinear** — creates a Linear XAML Gradient with two changeable colours and changeable angle
Gradients build in Xaml — Radial
We also can write Radial Gradients in Xaml as well. Here will be a quite similar principle to Linear Xaml Gradients.
**mgradial** — creates a Radial XAML Gradient with two changeable colours and changeable Center with X & Y positions
Gradients build in CSS
This is my favourite type of creating Gradients because it shows a whole power of CSS in Xamarin Forms and **SkiaSharp**.
**mgcssxaml** — if you prefer to use inline CSS instead of a separate file.
**mgcss** — if you wanna use a separate file with CSS code and left XAML file clean. Here is an only placeholder for Magic GradientView, all code for gradient should be placed in CSS file.
**mgcss** — a complete CSS Style with one Linear Gradient inside(this one for CSS language instead of XAML like previous)
**lg** — just one Linear Gradient in CSS interpretation with two colours.
**rg** — just one Radial Gradient in CSS interpretation with two colours.
Something missed?
If you missed or wanna add anything — please add a comment or write to me at twitter. I will be really happy to have more Magic Snippets.
