{"id":5009,"date":"2021-01-30T09:28:07","date_gmt":"2021-01-30T09:28:07","guid":{"rendered":"https:\/\/serkanseker.com\/?p=5009"},"modified":"2021-01-30T09:28:07","modified_gmt":"2021-01-30T09:28:07","slug":"xamarin-forms-pancakeview-eklentisi-kullanimi","status":"publish","type":"post","link":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/","title":{"rendered":"Xamarin.Forms PancakeView Eklentisi Kullan\u0131m\u0131"},"content":{"rendered":"<div class=\"entry-content entry clearfix\">\n<p>Bir Xamarin projesinde g\u00f6r\u00fcn\u00fcmleriniz i\u00e7in degradelere, kenarl\u0131klara, yuvarlat\u0131lm\u0131\u015f k\u00f6\u015felere ve g\u00f6lgelere ihtiyac\u0131n\u0131z varsa, PancakeView eklentisi tam size g\u00f6re.\u00a0<strong>PancakeView<\/strong>\u00a0eklentisi\u00a0ile mevcut Xamarin.Forms denetimleriyle yapamayaca\u011f\u0131n\u0131z bir\u00e7ok \u00f6zelle\u015ftirme yapabilirsiniz.<\/p>\n<p>Bu yaz\u0131mda, bir Xamarin.Forms projesinde PancakeView eklentisinin nas\u0131l kullan\u0131laca\u011f\u0131n\u0131 anlataca\u011f\u0131m.\u00a0Ayr\u0131ca, daha \u00f6nce yap\u0131m\u0131n\u0131 anlatt\u0131\u011f\u0131m <a href=\"https:\/\/www.serkanseker.com\/tr\/xamarin-forms-openweathermap-rest-api-kullanimi\/\" rel=\"noreferrer noopener\" target=\"_blank\">Hava Durumu<\/a> uygulamas\u0131n\u0131n aray\u00fcz\u00fcn\u00fc PancakeView ile \u00f6zelle\u015ftirece\u011fim.<\/p>\n<h2 class=\"wp-block-heading\"><span id=\"PancakeView_Nedir\">PancakeView Nedir?<\/span><\/h2>\n<p>PancakeView,\u00a0<a href=\"https:\/\/www.nuget.org\/profiles\/sthewissen\" rel=\"noreferrer noopener\" target=\"_blank\">Steven Thewissen<\/a>\u00a0taraf\u0131ndan yaz\u0131lm\u0131\u015f olan bir NuGet paketidir.\u00a0Tan\u0131m olarak, Xamarin.Forms i\u00e7in geni\u015fletilmi\u015f bir ContentView\u2019dir.\u00a0Yani, Xamarin.Forms g\u00f6r\u00fcn\u00fcmlerinde \u00f6zelle\u015ftirmeler sa\u011flar.<\/p>\n<p>PancakeView,\u00a0en kullan\u0131\u015fl\u0131 NuGet paketlerinden biridir\u00a0.\u00a0\u015eimdiden 390 bin indirmeye ula\u015fm\u0131\u015f olmas\u0131 ne kadar tercih edildi\u011fini g\u00f6steriyor.\u00a0Bu eklentiyi geli\u015ftirdi\u011fim uygulamalarda kullan\u0131yorum.\u00a0Sizin de Xamarin projelerinizde kullanman\u0131z\u0131 \u015fiddetle tavsiye ederim.<\/p>\n<p>Bildi\u011finiz gibi mevcut Xamarin.Forms kontrolleri ile yapabilece\u011fimiz \u00f6zelle\u015ftirmeler s\u0131n\u0131rl\u0131d\u0131r. Basit bir kullan\u0131c\u0131 aray\u00fcz\u00fcne sahip bir g\u00f6r\u00fcn\u00fcm istiyorsan\u0131z, bu kontroller isteklerinizi kar\u015f\u0131lar. Ancak,\u00a0Xamarin.Forms denetimleri ile istedi\u011fimiz g\u00f6r\u00fcn\u00fcmleri genellikle elde edemiyoruz. G\u00fczel bir UI elde etmek istiyorsan\u0131z, PancakeView eklentisi i\u015finizi kolayla\u015ft\u0131racakt\u0131r.<\/p>\n<h2 class=\"wp-block-heading\"><span id=\"PancakeView_Ozellikleri\">PancakeView \u00d6zellikleri<\/span><\/h2>\n<p>A\u015fa\u011f\u0131da PancakeView\u2019in baz\u0131 \u00f6zelliklerini a\u00e7\u0131klad\u0131m.\u00a0\u0130htiya\u00e7 duydu\u011funuz \u00f6zellikleri burada bulabilirsiniz.\u00a0Ayr\u0131ca k\u0131sa kodlar\u0131 kopyalay\u0131p g\u00f6r\u00fcn\u00fcmlere ekleyebilirsiniz.<\/p>\n<h3 class=\"wp-block-heading\"><span id=\"BordersKenarliklar\">Borders(Kenarl\u0131klar)<\/span><\/h3>\n<p>Ad\u0131ndan da anla\u015f\u0131laca\u011f\u0131 gibi, borders(kenarl\u0131klar) g\u00f6r\u00fcn\u00fcmleri \u00e7er\u00e7eveler.\u00a0Kenarl\u0131klar, \u00f6\u011feleri ay\u0131rt etmeyi kolayla\u015ft\u0131r\u0131r.<\/p>\n<p>Kenarl\u0131klar\u0131 kullanmak i\u00e7in Borders \u00f6zelli\u011fini PancakeView nesnesinin bir \u00f6rne\u011fine ekleyin.<\/p>\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-markup\">&lt;yummy:PancakeView&gt;\n    &lt;yummy:PancakeView.Border&gt;\n        &lt;yummy:Border Color=&quot;#000000&quot; Thickness=&quot;10&quot; \/&gt;\n    &lt;\/yummy:PancakeView.Border&gt;\n    &lt;Label Text=&quot;This is just a happy little label.&quot; \/&gt;\n&lt;\/yummy:PancakeView&gt;<\/code><\/pre>\n<p>Alternatif olarak,\u00a0<code>Border<\/code>\u00a0markup extension s\u00f6zdizimini\u00a0de kullanabilirsiniz.<\/p>\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-markup\">&lt;yummy:PancakeView Border=&quot;{yummy:BorderMarkup Color=#FF0000, Thickness=&#039;10&#039;}&quot;&gt;\n    &lt;Label Text=&quot;This is just a happy little label.&quot; \/&gt;\n&lt;\/yummy:PancakeView&gt;<\/code><\/pre>\n<ul class=\"wp-block-list\">\n<li><strong><strong>Color\u00a0<\/strong><\/strong>\u2013 Kenarl\u0131\u011f\u0131n rengi.<\/li>\n<li><strong>DashPattern<\/strong>\u00a0\u2013 Kenarl\u0131\u011f\u0131n bir \u00e7izgi desenine sahip olup olmad\u0131\u011f\u0131n\u0131 g\u00f6sterir.<\/li>\n<li><strong>DrawingStyle<\/strong>\u00a0\u2013 S\u0131n\u0131r\u0131n \u00e7izim stili (Inside, Outside, Centered).<\/li>\n<li><strong>GradientEndPoint<\/strong>\u00a0\u2013 Gradyan\u0131n g\u00f6receli u\u00e7 noktas\u0131n\u0131 tan\u0131mlar.\u00a0Her iki de\u011fer de 0 ile 1 aras\u0131nda bir de\u011ferdir. G\u00f6r\u00fcn\u00fcm i\u00e7indeki g\u00f6receli konumu belirtir.<\/li>\n<li><strong>GradientStartPoint<\/strong>\u00a0\u2013 Gradyan\u0131n g\u00f6receli ba\u015flang\u0131\u00e7 \u200b\u200bnoktas\u0131n\u0131 tan\u0131mlar.\u00a0Her iki de\u011fer de 0 ile 1 aras\u0131nda bir de\u011ferdir. G\u00f6r\u00fcn\u00fcm i\u00e7indeki g\u00f6receli konumu belirtir.<\/li>\n<li><strong>GradientStops<\/strong>\u00a0\u2013\u00a0Gradyan i\u00e7indeki duraklar\u0131 belirler.<\/li>\n<li><strong><strong>Thickness\u00a0<\/strong><\/strong>\u2013 Kenarl\u0131\u011f\u0131n kal\u0131nl\u0131\u011f\u0131.<\/li>\n<\/ul>\n<h3 class=\"wp-block-heading\"><span id=\"GradientsGradyanlar\">Gradients(Gradyanlar)<\/span><\/h3>\n<p>PancakeView eklentisi ile g\u00f6r\u00fcn\u00fcmlere kolayca gradyanlar ekleyebilirsiniz.\u00a0Gradyanlar\u0131 kullanmak i\u00e7in, PancakeView nesnesine BackgroundGradientStops \u00f6zelli\u011fini ekleyin.<\/p>\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-markup\">&lt;yummy:PancakeView BackgroundGradientStartPoint=&quot;0,0&quot; BackgroundGradientEndPoint=&quot;1,0&quot;&gt;\n   &lt;yummy:PancakeView.BackgroundGradientStops&gt;\n      &lt;yummy:GradientStopCollection&gt;\n         &lt;yummy:GradientStop Color=&quot;#FF0000&quot; Offset=&quot;0&quot; \/&gt;\n         &lt;yummy:GradientStop Color=&quot;#00FF00&quot; Offset=&quot;0.5&quot; \/&gt;\n         &lt;yummy:GradientStop Color=&quot;#0000FF&quot; Offset=&quot;1&quot; \/&gt;\n      &lt;\/yummy:GradientStopCollection&gt;\n   &lt;\/yummy:PancakeView.BackgroundGradientStops&gt;\n   &lt;Label Text=&quot;There are no mistakes, only happy accidents.&quot; \/&gt;\n&lt;\/yummy:PancakeView&gt;<\/code><\/pre>\n<ul class=\"wp-block-list\">\n<li><strong>BackgroundGradientEndPoint<\/strong>\u00a0\u2013 Gradyan\u0131n g\u00f6receli u\u00e7 noktas\u0131n\u0131 tan\u0131mlar.\u00a0Her iki de\u011fer de 0 ile 1 aras\u0131nda bir de\u011ferdir. G\u00f6r\u00fcn\u00fcm i\u00e7indeki g\u00f6receli konumu belirtir.<\/li>\n<li><strong>BackgroundGradientStartPoint<\/strong>\u00a0\u2013 Gradyan\u0131n g\u00f6receli ba\u015flang\u0131\u00e7 \u200b\u200bnoktas\u0131n\u0131 tan\u0131mlar.\u00a0Her iki de\u011fer de 0 ile 1 aras\u0131nda bir de\u011ferdir. G\u00f6r\u00fcn\u00fcm i\u00e7indeki g\u00f6receli konumu belirtir.<\/li>\n<li><strong>BackgroundGradientStops<\/strong>\u00a0\u2013 Gradyan i\u00e7indeki duraklar\u0131 belirtir.<\/li>\n<li><strong>Color <\/strong>\u2013 Gradyan\u0131n bu b\u00f6l\u00fcm\u00fcn\u00fcn rengi.<\/li>\n<li><strong><strong>Offset\u00a0<\/strong><\/strong>\u2013 Gradyan\u0131n i\u00e7indeki bu rengin Ofseti.<\/li>\n<\/ul>\n<h3 class=\"wp-block-heading\"><span id=\"Rounded_CornersYuvarlatilmis_Koseler\">Rounded Corners(Yuvarlat\u0131lm\u0131\u015f K\u00f6\u015feler)<\/span><\/h3>\n<p>K\u00f6\u015feleri yuvarlamak i\u00e7in RoundedCorner \u00f6zelli\u011fini kullan\u0131n.\u00a0Dilerseniz her k\u00f6\u015feyi farkl\u0131 bir a\u00e7\u0131ya yuvarlayabilirsiniz.<\/p>\n<p>Yuvarlat\u0131lm\u0131\u015f k\u00f6\u015feler eklemek i\u00e7in CornerRadius \u00f6zelli\u011fini PancakeView\u2019e ekleyin.<\/p>\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-markup\">&lt;yummy:PancakeView CornerRadius=&quot;10,40,20,10&quot;&gt;\n    &lt;Label Text=&quot;This is just a happy little label.&quot; \/&gt;\n&lt;\/yummy:PancakeView&gt;<\/code><\/pre>\n<ul class=\"wp-block-list\">\n<li><strong>CornerRadius<\/strong>\u00a0\u2013 Her k\u00f6\u015fenin yar\u0131\u00e7ap\u0131, sol \u00fcstten ba\u015flayarak saat y\u00f6n\u00fcnde.<\/li>\n<\/ul>\n<h3 class=\"wp-block-heading\"><span id=\"ShadowsGolgeler\">Shadows(G\u00f6lgeler)<\/span><\/h3>\n<p>Shadows kullanarak g\u00f6r\u00fcn\u00fcmleriniz aras\u0131nda g\u00f6rsel hiyerar\u015fi sa\u011flayabilirsiniz.\u00a0G\u00f6lgeli \u00f6\u011felerin daha \u00f6nemli oldu\u011funu bildirmek i\u00e7in kullan\u0131l\u0131r.<\/p>\n<p>G\u00f6lgeleri kullanmaya ba\u015flamak i\u00e7in Shadow \u00f6zelli\u011fini bir DropShadow nesnesi \u00f6rne\u011fine ayarlay\u0131n.<\/p>\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-markup\">&lt;yummy:PancakeView&gt;\n    &lt;yummy:PancakeView.Shadow&gt;\n        &lt;yummy:DropShadow Color=&quot;#000000&quot; Offset=&quot;10,10&quot; \/&gt;\n    &lt;\/yummy:PancakeView.Shadow&gt;\n    &lt;Label Text=&quot;This is just a happy little label.&quot; \/&gt;\n&lt;\/yummy:PancakeView&gt;<\/code><\/pre>\n<p>Alternatif olarak,\u00a0<code>Shadow<\/code>\u00a0markup extension syntax\u2019\u0131\u00a0da kullanabilirsiniz.<\/p>\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-markup\">&lt;yummy:PancakeView Shadow=&quot;{yummy:ShadowMarkup Color=#FF0000, Offset=&#039;10,10&#039;}&quot;&gt;\n    &lt;Label Text=&quot;This is just a happy little label.&quot; \/&gt;\n&lt;\/yummy:PancakeView&gt;<\/code><\/pre>\n<ul class=\"wp-block-list\">\n<li><strong><strong>BlurRadius\u00a0<\/strong><\/strong>\u2013\u00a0G\u00f6lgeyi olu\u015fturmak i\u00e7in kullan\u0131lan bulan\u0131kl\u0131\u011f\u0131n yar\u0131\u00e7ap\u0131.<\/li>\n<li><strong><strong>Color\u00a0<\/strong><\/strong>\u2013 G\u00f6lgenin rengi.<\/li>\n<li><strong><strong>Offset\u00a0<\/strong><\/strong>\u2013 G\u00f6lgenin merkezine g\u00f6re ofseti.<\/li>\n<li><strong><strong>Opacity\u00a0<\/strong><\/strong>\u2013 G\u00f6lgenin opakl\u0131\u011f\u0131.<\/li>\n<\/ul>\n<h2 class=\"wp-block-heading\"><span id=\"Hava_Durumu_Uygulamasi_Icin_Guzel_Kullanici_Arayuzu\">Hava Durumu Uygulamas\u0131 \u0130\u00e7in G\u00fczel Kullan\u0131c\u0131 Aray\u00fcz\u00fc<\/span><\/h2>\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><a href=\"https:\/\/www.serkanseker.com\/tr\/xamarin-forms-openweathermap-rest-api-kullanimi\/\" rel=\"noreferrer noopener\" target=\"_blank\">Xamarin.Forms OpenWeatherMap REST API<\/a>\u00a0adl\u0131\u00a0makalemde\u00a0OpenWeatherMap API ve\u00a0<a href=\"https:\/\/www.serkanseker.com\/tr\/xamarin-forms-mvvm-model\/\" rel=\"noreferrer noopener\" target=\"_blank\">MVVM modelini<\/a>\u00a0kullanarak bir hava durumu uygulamas\u0131n\u0131n nas\u0131l olu\u015fturulaca\u011f\u0131n\u0131 g\u00f6stermi\u015ftim.\u00a0Ancak, o projede yaln\u0131zca mevcut Xamarin.Forms denetimlerini kulland\u0131\u011f\u0131m i\u00e7in g\u00fczel bir kullan\u0131c\u0131 aray\u00fcz\u00fc elde edemedim.<\/p>\n<p>\u015eimdi, PancakeView eklentisinin Borders, Gradients, Rounded Corners ve Shadows gibi \u00f6zelliklerini kullanarak Hava Durmu uygulamas\u0131n\u0131n XAML g\u00f6r\u00fcn\u00fcm\u00fcn\u00fc yeniden tasarlayaca\u011f\u0131m.\u00a0Bakal\u0131m nas\u0131l bir sonu\u00e7 alaca\u011f\u0131m.\u00a0<\/p>\n<p>A\u015fa\u011f\u0131daki ad\u0131mlar\u0131 s\u0131ras\u0131yla uygulay\u0131n.<\/p>\n<\/div>\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" alt=\"Xamarin.Forms Hava Durumu Uygulamas\u0131\" class=\"wp-image-227 entered error\" data-lazyloaded=\"1\" data-ll-status=\"error\" data-sizes=\"(max-width: 512px) 100vw, 512px\" data-src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png\" data-srcset=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png 512w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-150x300.png 150w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-768x1536.png 768w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-1024x2048.png 1024w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi.png 1080w\" height=\"1024\" src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png\" width=\"512\" \/><figcaption>Xamarin.Forms Hava Durumu Uygulamas\u0131<\/figcaption><\/figure>\n<\/div>\n<\/div>\n<\/div>\n<h3 class=\"wp-block-heading\"><span id=\"1_Ikonlari_Ekleyin\">1) \u0130konlar\u0131 Ekleyin<\/span><\/h3>\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p>\u00d6ncelikle, g\u00f6r\u00fcn\u00fcmlerde kullanmak istedi\u011finiz simgeleri <strong>Android\/Resources\/drawable<\/strong> klas\u00f6r\u00fcne at\u0131n.\u00a0Ben Hava Durumu uygulamas\u0131 i\u00e7in alt\u0131 tane ikon kullanaca\u011f\u0131m.<\/p>\n<\/div>\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" alt=\"Xamarin Android drawable Folder\" class=\"wp-image-228 entered error\" data-lazyloaded=\"1\" data-ll-status=\"error\" data-sizes=\"(max-width: 233px) 100vw, 233px\" data-src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Android-drawable-Folder.jpg\" data-srcset=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Android-drawable-Folder.jpg 310w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Android-drawable-Folder-159x300.jpg 159w\" height=\"440\" src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Android-drawable-Folder.jpg\" width=\"233\" \/><figcaption>Xamarin.Android drawable klas\u00f6r\u00fc<\/figcaption><\/figure>\n<\/div>\n<\/div>\n<\/div>\n<h3 class=\"wp-block-heading\"><span id=\"2_PancakeView_Eklentisini_Yukleyin_ve_Baslatin\">2) PancakeView Eklentisini Y\u00fckleyin ve Ba\u015flat\u0131n<\/span><\/h3>\n<p>\u00d6ncelikle\u00a0<a href=\"https:\/\/www.nuget.org\/packages\/Xamarin.Forms.PancakeView\/2.3.0.763-beta\" rel=\"noreferrer noopener\" target=\"_blank\">PancakeView Nuget Paketini<\/a>\u00a0projede kullanabilmeniz i\u00e7in Xamarin projenize dahil etmelisiniz.<\/p>\n<p>A\u015fa\u011f\u0131daki kodu\u00a0<strong>Paket Y\u00f6neticisi Konsoluna<\/strong>\u00a0yazarak eklentiyi y\u00fckleyebilirsiniz. (bkz. <strong><a href=\"https:\/\/www.serkanseker.com\/tr\/visual-studio-nuget-paketlerini-yukleme\/#paket-y%C3%B6neticisi-konsolu\" rel=\"noreferrer noopener\" target=\"_blank\">Paket Y\u00f6neticisi Konsolu ile NuGet Paketlerini Y\u00fckleme<\/a><\/strong>)<\/p>\n<pre class=\"wp-block-code\"><code>Install-Package Xamarin.Forms.PancakeView -Version 2.3.0.763-beta<\/code><\/pre>\n<p>Alternatif olarak,\u00a0<strong>NuGet Packages Manager\u2019dan<\/strong>\u00a0indirebilirsiniz.\u00a0(bkz. <strong><a href=\"https:\/\/www.serkanseker.com\/tr\/visual-studio-nuget-paketlerini-yukleme\/#nuget-paket-y%C3%B6neticisi\" rel=\"noreferrer noopener\" target=\"_blank\">NuGet Paket Y\u00f6neticisi \u0130le NuGet Paketlerini Y\u00fckleme<\/a><\/strong>)<\/p>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" alt=\"PancakeView NuGet Paket Y\u00f6neticisi\" class=\"wp-image-230 entered error\" data-lazyloaded=\"1\" data-ll-status=\"error\" data-sizes=\"(max-width: 1012px) 100vw, 1012px\" data-src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-NuGet-Paket-Yoneticisi.jpg\" data-srcset=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-NuGet-Paket-Yoneticisi.jpg 1012w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-NuGet-Paket-Yoneticisi-300x174.jpg 300w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-NuGet-Paket-Yoneticisi-768x445.jpg 768w\" height=\"586\" src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-NuGet-Paket-Yoneticisi.jpg\" width=\"1012\" \/><figcaption>PancakeView NuGet Paketini Y\u00fckleyin<\/figcaption><\/figure>\n<p><span class=\"ugb-highlight\" style=\"color: #222222;background-color: var(--nv-c-2)\">Bu projede PancakeView 1.4.6 s\u00fcr\u00fcm\u00fcn\u00fc kurdum.\u00a0Bu y\u00fczden \u00f6rnekleri bu versiyona g\u00f6re yapaca\u011f\u0131m.\u00a0Projenizde daha eski bir s\u00fcr\u00fcm kuruluysa, g\u00fcncellemeniz gerekir.<\/span><\/p>\n<p>PancakeView eklentisini Android platformunda \u00e7al\u0131\u015ft\u0131rmak i\u00e7in di\u011fer eklentiler gibi ba\u015flat\u0131c\u0131 y\u00f6ntemini \u00e7a\u011f\u0131rmaya gerek yoktur.\u00a0Kullanmak i\u00e7in, gerekli XAML namespace\u2019leri g\u00f6r\u00fcn\u00fcmlere eklemek yeterlidir.<\/p>\n<h3 class=\"wp-block-heading\"><span id=\"3_XAML_Namespace8217leri_Ekleyin\">3) XAML Namespace\u2019leri Ekleyin<\/span><\/h3>\n<p>PancakeView eklentisini XAML\u2019da kullanmak i\u00e7in gerekli PancakeView namespace\u2019yi eklemeniz gerekir. Varsay\u0131lan olmayan bir parametre oldu\u011fundan genellikle\u00a0<strong>pancakeview<\/strong>\u00a0\u00f6neki\u00a0kullan\u0131r. Tabi ki bu sizin tercihinize kalm\u0131\u015f.\u00a0<\/p>\n<p>A\u015fa\u011f\u0131daki kodu XAML sayfan\u0131za ekleyin.<\/p>\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-markup\">xmlns:pancakeview=&quot;clr-namespace:Xamarin.Forms.PancakeView;assembly=Xamarin.Forms.PancakeView&quot;<\/code><\/pre>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" alt=\"PancakeView xaml namespace\" class=\"wp-image-232 entered error\" data-lazyloaded=\"1\" data-ll-status=\"error\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" data-src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-xaml-namespace-1024x256.jpg\" data-srcset=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-xaml-namespace-1024x256.jpg 1024w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-xaml-namespace-300x75.jpg 300w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-xaml-namespace-768x192.jpg 768w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-xaml-namespace.jpg 1251w\" height=\"256\" src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-xaml-namespace-1024x256.jpg\" width=\"1024\" \/><figcaption>XAML\u2019a gerekli PancakeView namespace\u2019yi ekleyin<\/figcaption><\/figure>\n<h3 class=\"wp-block-heading\"><span id=\"4_ContentPage8217e_PancakeView_Ekleyin\">4) ContentPage\u2019e PancakeView Ekleyin<\/span><\/h3>\n<p>Bu ContentPage\u2019e 5 sat\u0131rdan olu\u015fan bir grid yap\u0131s\u0131 ekledim.\u00a0Bu sat\u0131rlar\u0131n her biri PancakeView ile \u00f6zelle\u015ftirmek istedi\u011fim alanlar olacak.\u00a0Yani, ilk sat\u0131r gezinme \u00e7ubu\u011fu, ikinci sat\u0131r, hava durumu verilerini i\u00e7eren kart vb.<\/p>\n<p><span class=\"ugb-highlight\" style=\"color: var(--nv-primary-accent);background-color: var(--nv-light-bg)\">1<\/span> Grid yap\u0131s\u0131n\u0131n ilk sat\u0131r\u0131na bir navigasyon men\u00fcs\u00fc ekledim.\u00a0Bu gezinme men\u00fcs\u00fcnde g\u00f6rd\u00fc\u011f\u00fcn\u00fcz art\u0131 ve men\u00fc ikonlar\u0131n\u0131 bir PancakeView i\u00e7erisinde g\u00f6sterdim.\u00a0Yani bu bildi\u011fimiz Xamarin.Forms d\u00fc\u011fmesi de\u011fil.\u00a041px geni\u015fli\u011finde ve y\u00fcksekli\u011finde, CornerRadius\u2019u 10, G\u00f6lge rengi #000 ve BackgroundColor\u2019u #FFF olan bir PancakeView, .<\/p>\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-markup\">&lt;StackLayout Grid.Row=&quot;0&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; Margin=&quot;20,10,20,10&quot;  &gt;\n    &lt;Grid&gt;\n        &lt;Grid.ColumnDefinitions&gt;\n            &lt;ColumnDefinition Width=&quot;Auto&quot; \/&gt;\n            &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n            &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n            &lt;ColumnDefinition Width=&quot;Auto&quot; \/&gt;\n        &lt;\/Grid.ColumnDefinitions&gt;\n        &lt;pancakeview:PancakeView Grid.Column=&quot;0&quot; WidthRequest=&quot;41&quot; HeightRequest=&quot;41&quot; CornerRadius=&quot;10&quot;  BackgroundColor=&quot;#FFF&quot;&gt;\n            &lt;pancakeview:PancakeView.Shadow&gt;\n                &lt;pancakeview:DropShadow Color=&quot;#000&quot;\/&gt;\n            &lt;\/pancakeview:PancakeView.Shadow&gt;\n            &lt;Image Source=&quot;add.png&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; Margin=&quot;10&quot; \/&gt;\n        &lt;\/pancakeview:PancakeView&gt;\n        &lt;pancakeview:PancakeView Grid.Column=&quot;3&quot; WidthRequest=&quot;41&quot; HeightRequest=&quot;41&quot; CornerRadius=&quot;10&quot; BackgroundColor=&quot;#FFF&quot;&gt;\n            &lt;pancakeview:PancakeView.Shadow&gt;\n                &lt;pancakeview:DropShadow Color=&quot;#000&quot;   \/&gt;\n            &lt;\/pancakeview:PancakeView.Shadow&gt;\n            &lt;Image Source=&quot;menu.png&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; Margin=&quot;10&quot; \/&gt;\n        &lt;\/pancakeview:PancakeView&gt;\n    &lt;\/Grid&gt;\n&lt;\/StackLayout&gt;<\/code><\/pre>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" alt=\"PancakeView men\u00fc\" class=\"wp-image-233 entered error\" data-lazyloaded=\"1\" data-ll-status=\"error\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" data-src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-menu-1024x160.png\" data-srcset=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-menu-1024x160.png 1024w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-menu-300x47.png 300w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-menu-768x120.png 768w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-menu.png 1080w\" height=\"160\" src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-menu-1024x160.png\" width=\"1024\" \/><figcaption>men\u00fc<\/figcaption><\/figure>\n<p><span class=\"ugb-highlight\" style=\"color: var(--nv-primary-accent);background-color: var(--nv-light-bg)\">2<\/span> \u0130kinci sat\u0131rda hava durumu verilerini i\u00e7eren bir kart var.\u00a0Bu kart, Hava Durumu uygulamas\u0131n\u0131n ana verilerini i\u00e7eren g\u00f6r\u00fcn\u00fcmd\u00fcr.\u00a0Bu kart\u0131n uygulama hiyerar\u015fisinde \u00f6ne \u00e7\u0131kmas\u0131n\u0131 istedim.\u00a0Bu y\u00fczden ikinci sat\u0131ra geni\u015fli\u011fi 450px, y\u00fcksekli\u011fi 200px ve CornerRadius\u2019u 10 olan bir PancakeView ekledim.\u00a0Ayr\u0131ca bu PancakeView\u2019de Label ve Image i\u00e7erisinde API\u2019den ald\u0131\u011f\u0131m verileri g\u00f6sterdim.<\/p>\n<p>Arka plan olarak PancakeView\u2019\u0131n Gradient \u00f6zelli\u011fini kulland\u0131m.\u00a0Kodlardan\u00a0da\u00a0anla\u015f\u0131laca\u011f\u0131\u00a0\u00fczere\u00a0#87a8d0\u00a0,\u00a0#b9ceeb\u00a0,\u00a0#deecfc\u00a0renklerini\u00a0s\u0131ras\u0131yla 0, 0.75, 1 Offset de\u011ferlerine\u00a0ayarlad\u0131m.\u00a0Bu renk tonlar\u0131n\u0131n yak\u0131nl\u0131\u011f\u0131, PancakeView g\u00f6r\u00fcn\u00fcm\u00fcnde bir ge\u00e7i\u015f sa\u011flam\u0131\u015ft\u0131r.<\/p>\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-markup\">&lt;pancakeview:PancakeView Grid.Row=&quot;1&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; WidthRequest=&quot;450&quot; HeightRequest=&quot;200&quot; CornerRadius=&quot;10&quot; Margin=&quot;20,10,20,10&quot;  &gt;\n    &lt;pancakeview:PancakeView.BackgroundGradientStops BackgroundGradientStartPoint=&quot;0,0&quot; BackgroundGradientEndPoint=&quot;1,0&quot;&gt;\n        &lt;pancakeview:GradientStop Color=&quot;#87a8d0&quot; Offset=&quot;0&quot;\/&gt;\n        &lt;pancakeview:GradientStop Color=&quot;#b9ceeb&quot; Offset=&quot;0.75&quot;\/&gt;\n        &lt;pancakeview:GradientStop Color=&quot;#deecfc&quot; Offset=&quot;1&quot;\/&gt;\n    &lt;\/pancakeview:PancakeView.BackgroundGradientStops&gt;\n    &lt;pancakeview:PancakeView.Shadow&gt;\n        &lt;pancakeview:DropShadow Color=&quot;#000000&quot; Offset=&quot;10,10&quot;   \/&gt;\n    &lt;\/pancakeview:PancakeView.Shadow&gt;\n    &lt;StackLayout VerticalOptions=&quot;CenterAndExpand&quot; Margin=&quot;20&quot;&gt;\n        &lt;Grid&gt;\n            &lt;Grid.RowDefinitions&gt;\n                &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n                &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n                &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n                &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n            &lt;\/Grid.RowDefinitions&gt;\n            &lt;Grid.ColumnDefinitions&gt;\n                &lt;ColumnDefinition Width=&quot;Auto&quot; \/&gt;\n                &lt;ColumnDefinition Width=&quot;Auto&quot; \/&gt;\n            &lt;\/Grid.ColumnDefinitions&gt;\n            &lt;Label Grid.Row=&quot;0&quot; Grid.Column=&quot;0&quot;  Text=&quot;{Binding Source={x:Static sys:DateTime.Now}, StringFormat=&#039;{0:MMMM dd, yyyy}&#039;}&quot; FontSize=&quot;15&quot; TextColor=&quot;#FFF&quot;\/&gt;\n            &lt;Label Grid.Row=&quot;1&quot; Grid.Column=&quot;0&quot;  Text=&quot;{Binding timezone}&quot; FontSize=&quot;15&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#FFF&quot;\/&gt;\n            &lt;Label Grid.Row=&quot;2&quot; Grid.Column=&quot;0&quot;  Text=&quot;{Binding current.temp, StringFormat=&#039;{0:N0}\u00b0&#039;}&quot; FontSize=&quot;52&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#FFF&quot;\/&gt;\n            &lt;Label Grid.Row=&quot;3&quot; Text=&quot;{Binding current.weather[0].main}&quot; FontSize=&quot;15&quot; TextColor=&quot;#FFF&quot;\/&gt;\n            &lt;Image Grid.Row=&quot;0&quot; Grid.Column=&quot;1&quot; Grid.ColumnSpan=&quot;2&quot; Grid.RowSpan=&quot;4&quot; WidthRequest=&quot;175&quot; HeightRequest=&quot;175&quot; VerticalOptions=&quot;CenterAndExpand&quot; HorizontalOptions=&quot;CenterAndExpand&quot; Source=&quot;{Binding current.weather[0].icon_url}&quot; \/&gt;\n        &lt;\/Grid&gt;\n    &lt;\/StackLayout&gt;\n&lt;\/pancakeview:PancakeView&gt;<\/code><\/pre>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" alt=\"PancakeView gradyan\" class=\"wp-image-235 entered error\" data-lazyloaded=\"1\" data-ll-status=\"error\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" data-src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-gradyan-1024x565.png\" data-srcset=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-gradyan-1024x565.png 1024w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-gradyan-300x165.png 300w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-gradyan-768x424.png 768w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-gradyan.png 1079w\" height=\"565\" src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-gradyan-1024x565.png\" width=\"1024\" \/><figcaption>gradyan<\/figcaption><\/figure>\n<p><span class=\"ugb-highlight\" style=\"color: var(--nv-primary-accent);background-color: var(--nv-light-bg)\">3<\/span> \u00dc\u00e7\u00fcnc\u00fc sat\u0131rda, bir PancakeView i\u00e7erisinde ikonlar ve Label\u2019ler ile r\u00fczgar h\u0131z\u0131, nem, g\u00fcn do\u011fumu ve g\u00fcn bat\u0131m\u0131 saatini g\u00f6sterdim.<\/p>\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-markup\">&lt;pancakeview:PancakeView Grid.Row=&quot;2&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; WidthRequest=&quot;450&quot; HeightRequest=&quot;100&quot; CornerRadius=&quot;10&quot; Margin=&quot;20,10,20,10&quot;   BackgroundColor=&quot;#FFF&quot;&gt;\n    &lt;pancakeview:PancakeView.Shadow&gt;\n        &lt;pancakeview:DropShadow Color=&quot;#9a9b94&quot; Offset=&quot;5,5&quot;   \/&gt;\n    &lt;\/pancakeview:PancakeView.Shadow&gt;\n    &lt;StackLayout HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; Margin=&quot;0,20,0,20&quot; &gt;\n        &lt;Grid &gt;\n            &lt;Grid.ColumnDefinitions&gt;\n                &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n            &lt;\/Grid.ColumnDefinitions&gt;\n            &lt;pancakeview:PancakeView Grid.Column=&quot;0&quot;  WidthRequest=&quot;48&quot; HeightRequest=&quot;100&quot; CornerRadius=&quot;20,0,20,0&quot;&gt;\n                &lt;StackLayout&gt;\n                    &lt;Image Grid.Row=&quot;0&quot; Source=&quot;wind.png&quot;  WidthRequest=&quot;31&quot; HeightRequest=&quot;31&quot; \/&gt;\n                    &lt;Label Grid.Row=&quot;1&quot;  Text=&quot;{Binding current.wind_speed, StringFormat=&#039;{0:N0} km\/h&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;13&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                &lt;\/StackLayout&gt;\n            &lt;\/pancakeview:PancakeView&gt;\n            &lt;pancakeview:PancakeView Grid.Column=&quot;1&quot;  WidthRequest=&quot;48&quot; HeightRequest=&quot;100&quot; &gt;\n                &lt;StackLayout&gt;\n                    &lt;Image Grid.Row=&quot;0&quot; Source=&quot;humidity.png&quot;  WidthRequest=&quot;31&quot; HeightRequest=&quot;31&quot;\/&gt;\n                    &lt;Label Grid.Row=&quot;1&quot;  Text=&quot;{Binding current.humidity, StringFormat=&#039;{0:N0}%&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;13&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                &lt;\/StackLayout&gt;\n            &lt;\/pancakeview:PancakeView&gt;\n            &lt;pancakeview:PancakeView Grid.Column=&quot;2&quot;  WidthRequest=&quot;48&quot; HeightRequest=&quot;100&quot; &gt;\n                &lt;StackLayout&gt;\n                    &lt;Image Grid.Row=&quot;0&quot; Source=&quot;sunrise.png&quot;  WidthRequest=&quot;31&quot; HeightRequest=&quot;31&quot; \/&gt;\n                    &lt;Label Grid.Row=&quot;1&quot;  Text=&quot;{Binding current.sunrise_time, StringFormat=&#039;{0:HH:mm}&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;13&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                &lt;\/StackLayout&gt;\n            &lt;\/pancakeview:PancakeView&gt;\n            &lt;pancakeview:PancakeView Grid.Column=&quot;3&quot;  WidthRequest=&quot;48&quot; HeightRequest=&quot;100&quot;  CornerRadius=&quot;0,20,0,20&quot;&gt;\n                &lt;StackLayout&gt;\n                    &lt;Image Grid.Row=&quot;0&quot; Source=&quot;sunset.png&quot;  WidthRequest=&quot;31&quot; HeightRequest=&quot;31&quot;\/&gt;\n                    &lt;Label Grid.Row=&quot;1&quot;  Text=&quot;{Binding current.sunset_time, StringFormat=&#039;{0:HH:mm}&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;13&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                &lt;\/StackLayout&gt;\n            &lt;\/pancakeview:PancakeView&gt;\n        &lt;\/Grid&gt;\n    &lt;\/StackLayout&gt;\n&lt;\/pancakeview:PancakeView&gt;<\/code><\/pre>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" alt=\"PancakeView card\" class=\"wp-image-236 entered error\" data-lazyloaded=\"1\" data-ll-status=\"error\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" data-src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-card-1024x350.png\" data-srcset=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-card-1024x350.png 1024w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-card-300x103.png 300w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-card-768x262.png 768w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-card.png 1080w\" height=\"350\" src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/PancakeView-card-1024x350.png\" width=\"1024\" \/><figcaption>card<\/figcaption><\/figure>\n<p>A\u015fa\u011f\u0131da t\u00fcm sayfan\u0131n kodlar\u0131n\u0131 bulabilirsiniz.<\/p>\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-markup\">&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot; ?&gt;\n&lt;ContentPage xmlns=&quot;http:\/\/xamarin.com\/schemas\/2014\/forms&quot;\n             xmlns:x=&quot;http:\/\/schemas.microsoft.com\/winfx\/2009\/xaml&quot;\n             xmlns:d=&quot;http:\/\/xamarin.com\/schemas\/2014\/forms\/design&quot;\n             xmlns:mc=&quot;http:\/\/schemas.openxmlformats.org\/markup-compatibility\/2006&quot;\n             xmlns:sys=&quot;clr-namespace:System;assembly=mscorlib&quot;\n             xmlns:pancakeview=&quot;clr-namespace:Xamarin.Forms.PancakeView;assembly=Xamarin.Forms.PancakeView&quot;\n             mc:Ignorable=&quot;d&quot;\n             x:Class=&quot;Weather.MainPage&quot;\n             BackgroundColor=&quot;#F5F8FD&quot;&gt;\n    &lt;ScrollView&gt;\n        &lt;StackLayout&gt;\n            &lt;CollectionView ItemsSource=&quot;{Binding WeatherList}&quot;&gt;\n                &lt;CollectionView.ItemsLayout&gt;\n                    &lt;GridItemsLayout  Orientation=&quot;Vertical&quot; \/&gt;\n                &lt;\/CollectionView.ItemsLayout&gt;\n                &lt;CollectionView.ItemTemplate&gt;\n                    &lt;DataTemplate&gt;\n                        &lt;StackLayout&gt;\n                            &lt;Grid&gt;\n                                &lt;Grid.RowDefinitions&gt;\n                                    &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n                                    &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n                                    &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n                                    &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n                                    &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n                                &lt;\/Grid.RowDefinitions&gt;\n                                &lt;StackLayout Grid.Row=&quot;0&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; Margin=&quot;20,10,20,10&quot;  &gt;\n                                    &lt;Grid&gt;\n                                        &lt;Grid.ColumnDefinitions&gt;\n                                            &lt;ColumnDefinition Width=&quot;Auto&quot; \/&gt;\n                                            &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                                            &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                                            &lt;ColumnDefinition Width=&quot;Auto&quot; \/&gt;\n                                        &lt;\/Grid.ColumnDefinitions&gt;\n                                        &lt;pancakeview:PancakeView Grid.Column=&quot;0&quot; WidthRequest=&quot;41&quot; HeightRequest=&quot;41&quot; CornerRadius=&quot;10&quot;  BackgroundColor=&quot;#FFF&quot;&gt;\n                                            &lt;pancakeview:PancakeView.Shadow&gt;\n                                                &lt;pancakeview:DropShadow Color=&quot;#000&quot;\/&gt;\n                                            &lt;\/pancakeview:PancakeView.Shadow&gt;\n                                            &lt;Image Source=&quot;add.png&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; Margin=&quot;10&quot; \/&gt;\n                                        &lt;\/pancakeview:PancakeView&gt;\n                                        &lt;pancakeview:PancakeView Grid.Column=&quot;3&quot; WidthRequest=&quot;41&quot; HeightRequest=&quot;41&quot; CornerRadius=&quot;10&quot; BackgroundColor=&quot;#FFF&quot;&gt;\n                                            &lt;pancakeview:PancakeView.Shadow&gt;\n                                                &lt;pancakeview:DropShadow Color=&quot;#000&quot;   \/&gt;\n                                            &lt;\/pancakeview:PancakeView.Shadow&gt;\n                                            &lt;Image Source=&quot;menu.png&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; Margin=&quot;10&quot; \/&gt;\n                                        &lt;\/pancakeview:PancakeView&gt;\n                                    &lt;\/Grid&gt;\n                                &lt;\/StackLayout&gt;\n                                &lt;pancakeview:PancakeView Grid.Row=&quot;1&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; WidthRequest=&quot;450&quot; HeightRequest=&quot;200&quot; CornerRadius=&quot;10&quot; Margin=&quot;20,10,20,10&quot;  &gt;\n                                    &lt;pancakeview:PancakeView.BackgroundGradientStops BackgroundGradientStartPoint=&quot;0,0&quot; BackgroundGradientEndPoint=&quot;1,0&quot;&gt;\n                                        &lt;pancakeview:GradientStop Color=&quot;#87a8d0&quot; Offset=&quot;0&quot;\/&gt;\n                                        &lt;pancakeview:GradientStop Color=&quot;#b9ceeb&quot; Offset=&quot;0.75&quot;\/&gt;\n                                        &lt;pancakeview:GradientStop Color=&quot;#deecfc&quot; Offset=&quot;1&quot;\/&gt;\n                                    &lt;\/pancakeview:PancakeView.BackgroundGradientStops&gt;\n                                    &lt;pancakeview:PancakeView.Shadow&gt;\n                                        &lt;pancakeview:DropShadow Color=&quot;#000000&quot; Offset=&quot;10,10&quot;   \/&gt;\n                                    &lt;\/pancakeview:PancakeView.Shadow&gt;\n                                    &lt;StackLayout VerticalOptions=&quot;CenterAndExpand&quot; Margin=&quot;20&quot;&gt;\n                                        &lt;Grid&gt;\n                                            &lt;Grid.RowDefinitions&gt;\n                                                &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n                                                &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n                                                &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n                                                &lt;RowDefinition Height=&quot;Auto&quot;\/&gt;\n                                            &lt;\/Grid.RowDefinitions&gt;\n                                            &lt;Grid.ColumnDefinitions&gt;\n                                                &lt;ColumnDefinition Width=&quot;Auto&quot; \/&gt;\n                                                &lt;ColumnDefinition Width=&quot;Auto&quot; \/&gt;\n                                            &lt;\/Grid.ColumnDefinitions&gt;\n                                            &lt;Label Grid.Row=&quot;0&quot; Grid.Column=&quot;0&quot;  Text=&quot;{Binding Source={x:Static sys:DateTime.Now}, StringFormat=&#039;{0:MMMM dd, yyyy}&#039;}&quot; FontSize=&quot;15&quot; TextColor=&quot;#FFF&quot;\/&gt;\n                                            &lt;Label Grid.Row=&quot;1&quot; Grid.Column=&quot;0&quot;  Text=&quot;{Binding timezone}&quot; FontSize=&quot;15&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#FFF&quot;\/&gt;\n                                            &lt;Label Grid.Row=&quot;2&quot; Grid.Column=&quot;0&quot;  Text=&quot;{Binding current.temp, StringFormat=&#039;{0:N0}\u00b0&#039;}&quot; FontSize=&quot;52&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#FFF&quot;\/&gt;\n                                            &lt;Label Grid.Row=&quot;3&quot; Text=&quot;{Binding current.weather[0].main}&quot; FontSize=&quot;15&quot; TextColor=&quot;#FFF&quot;\/&gt;\n                                            &lt;Image Grid.Row=&quot;0&quot; Grid.Column=&quot;1&quot; Grid.ColumnSpan=&quot;2&quot; Grid.RowSpan=&quot;4&quot; WidthRequest=&quot;175&quot; HeightRequest=&quot;175&quot; VerticalOptions=&quot;CenterAndExpand&quot; HorizontalOptions=&quot;CenterAndExpand&quot; Source=&quot;{Binding current.weather[0].icon_url}&quot; \/&gt;\n                                        &lt;\/Grid&gt;\n                                    &lt;\/StackLayout&gt;\n                                &lt;\/pancakeview:PancakeView&gt;\n                                &lt;pancakeview:PancakeView Grid.Row=&quot;2&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; WidthRequest=&quot;450&quot; HeightRequest=&quot;100&quot; CornerRadius=&quot;10&quot; Margin=&quot;20,10,20,10&quot;   BackgroundColor=&quot;#FFF&quot;&gt;\n                                    &lt;pancakeview:PancakeView.Shadow&gt;\n                                        &lt;pancakeview:DropShadow Color=&quot;#9a9b94&quot; Offset=&quot;5,5&quot;   \/&gt;\n                                    &lt;\/pancakeview:PancakeView.Shadow&gt;\n                                    &lt;StackLayout HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; Margin=&quot;0,20,0,20&quot; &gt;\n                                        &lt;Grid &gt;\n                                            &lt;Grid.ColumnDefinitions&gt;\n                                                &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                                                &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                                                &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                                                &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                                            &lt;\/Grid.ColumnDefinitions&gt;\n                                            &lt;pancakeview:PancakeView Grid.Column=&quot;0&quot;  WidthRequest=&quot;48&quot; HeightRequest=&quot;100&quot; CornerRadius=&quot;20,0,20,0&quot;&gt;\n                                                &lt;StackLayout&gt;\n                                                    &lt;Image Grid.Row=&quot;0&quot; Source=&quot;wind.png&quot;  WidthRequest=&quot;31&quot; HeightRequest=&quot;31&quot; \/&gt;\n                                                    &lt;Label Grid.Row=&quot;1&quot;  Text=&quot;{Binding current.wind_speed, StringFormat=&#039;{0:N0} km\/h&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;13&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                                                &lt;\/StackLayout&gt;\n                                            &lt;\/pancakeview:PancakeView&gt;\n                                            &lt;pancakeview:PancakeView Grid.Column=&quot;1&quot;  WidthRequest=&quot;48&quot; HeightRequest=&quot;100&quot; &gt;\n                                                &lt;StackLayout&gt;\n                                                    &lt;Image Grid.Row=&quot;0&quot; Source=&quot;humidity.png&quot;  WidthRequest=&quot;31&quot; HeightRequest=&quot;31&quot;\/&gt;\n                                                    &lt;Label Grid.Row=&quot;1&quot;  Text=&quot;{Binding current.humidity, StringFormat=&#039;{0:N0}%&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;13&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                                                &lt;\/StackLayout&gt;\n                                            &lt;\/pancakeview:PancakeView&gt;\n                                            &lt;pancakeview:PancakeView Grid.Column=&quot;2&quot;  WidthRequest=&quot;48&quot; HeightRequest=&quot;100&quot; &gt;\n                                                &lt;StackLayout&gt;\n                                                    &lt;Image Grid.Row=&quot;0&quot; Source=&quot;sunrise.png&quot;  WidthRequest=&quot;31&quot; HeightRequest=&quot;31&quot; \/&gt;\n                                                    &lt;Label Grid.Row=&quot;1&quot;  Text=&quot;{Binding current.sunrise_time, StringFormat=&#039;{0:HH:mm}&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;13&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                                                &lt;\/StackLayout&gt;\n                                            &lt;\/pancakeview:PancakeView&gt;\n                                            &lt;pancakeview:PancakeView Grid.Column=&quot;3&quot;  WidthRequest=&quot;48&quot; HeightRequest=&quot;100&quot;  CornerRadius=&quot;0,20,0,20&quot;&gt;\n                                                &lt;StackLayout&gt;\n                                                    &lt;Image Grid.Row=&quot;0&quot; Source=&quot;sunset.png&quot;  WidthRequest=&quot;31&quot; HeightRequest=&quot;31&quot;\/&gt;\n                                                    &lt;Label Grid.Row=&quot;1&quot;  Text=&quot;{Binding current.sunset_time, StringFormat=&#039;{0:HH:mm}&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;13&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                                                &lt;\/StackLayout&gt;\n                                            &lt;\/pancakeview:PancakeView&gt;\n                                        &lt;\/Grid&gt;\n                                    &lt;\/StackLayout&gt;\n                                &lt;\/pancakeview:PancakeView&gt;\n                                &lt;StackLayout Grid.Row=&quot;3&quot; HorizontalOptions=&quot;Center&quot;  VerticalOptions=&quot;Center&quot; Margin=&quot;20,5,20,5&quot; &gt;\n                                    &lt;Grid&gt;\n                                        &lt;Grid.ColumnDefinitions&gt;\n                                            &lt;ColumnDefinition Width=&quot;*&quot;\/&gt;\n                                            &lt;ColumnDefinition Width=&quot;*&quot;\/&gt;\n                                            &lt;ColumnDefinition Width=&quot;*&quot;\/&gt;\n                                            &lt;ColumnDefinition Width=&quot;*&quot;\/&gt;\n                                        &lt;\/Grid.ColumnDefinitions&gt;\n                                        &lt;Label Grid.Column=&quot;0&quot; Text=&quot;4 Days&quot; FontSize=&quot;15&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;  HorizontalTextAlignment=&quot;Start&quot; \/&gt;\n                                        &lt;Label  Grid.Column=&quot;3&quot; Text=&quot;See All&quot;  FontSize=&quot;15&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#91B3EE&quot; HorizontalTextAlignment=&quot;End&quot; \/&gt;\n                                    &lt;\/Grid&gt;\n                                &lt;\/StackLayout&gt;\n                                &lt;pancakeview:PancakeView Grid.Row=&quot;4&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; WidthRequest=&quot;400&quot; HeightRequest=&quot;175&quot; CornerRadius=&quot;10&quot; Margin=&quot;20,5,20,5&quot;  BackgroundColor=&quot;Transparent&quot;&gt;\n                                    &lt;StackLayout HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; &gt;\n                                        &lt;Grid &gt;\n                                            &lt;Grid.ColumnDefinitions&gt;\n                                                &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                                                &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                                                &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                                                &lt;ColumnDefinition Width=&quot;*&quot; \/&gt;\n                                            &lt;\/Grid.ColumnDefinitions&gt;\n                                            &lt;pancakeview:PancakeView Grid.Column=&quot;0&quot;  WidthRequest=&quot;100&quot; HeightRequest=&quot;175&quot; CornerRadius=&quot;10&quot; BackgroundColor=&quot;#91B3EE&quot;&gt;\n                                                &lt;StackLayout Margin=&quot;5&quot;&gt;\n                                                    &lt;Label Grid.Row=&quot;0&quot; Grid.Column=&quot;0&quot; Text=&quot;{Binding daily[1].date_time, StringFormat=&#039;{0:M}&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;15&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#FFF&quot;\/&gt;\n                                                    &lt;Image Grid.Row=&quot;1&quot; Grid.Column=&quot;0&quot; Source=&quot;{Binding daily[1].weather[0].icon_url}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot;\/&gt;\n                                                    &lt;Label Grid.Row=&quot;2&quot; Grid.Column=&quot;0&quot; Text=&quot;{Binding daily[1].temp.day, StringFormat=&#039;{0:N0}\u00b0&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;25&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#FFF&quot;\/&gt;\n                                                &lt;\/StackLayout&gt;\n                                            &lt;\/pancakeview:PancakeView&gt;\n                                            &lt;pancakeview:PancakeView  Grid.Column=&quot;1&quot;  WidthRequest=&quot;100&quot; HeightRequest=&quot;175&quot; CornerRadius=&quot;10&quot; BackgroundColor=&quot;#FFF&quot;&gt;\n                                                &lt;StackLayout  Margin=&quot;5&quot;&gt;\n                                                    &lt;Label Grid.Row=&quot;0&quot; Grid.Column=&quot;0&quot; Text=&quot;{Binding daily[2].date_time, StringFormat=&#039;{0:M}&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;15&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                                                    &lt;Image Grid.Row=&quot;1&quot; Grid.Column=&quot;0&quot; Source=&quot;{Binding daily[2].weather[0].icon_url}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot;\/&gt;\n                                                    &lt;Label Grid.Row=&quot;2&quot; Grid.Column=&quot;0&quot; Text=&quot;{Binding daily[2].temp.day, StringFormat=&#039;{0:N0}\u00b0&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;25&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                                                &lt;\/StackLayout&gt;\n                                            &lt;\/pancakeview:PancakeView&gt;\n                                            &lt;pancakeview:PancakeView Grid.Column=&quot;2&quot;  WidthRequest=&quot;100&quot; HeightRequest=&quot;175&quot; CornerRadius=&quot;10&quot; BackgroundColor=&quot;#FFF&quot; &gt;\n                                                &lt;StackLayout  Margin=&quot;5&quot;&gt;\n                                                    &lt;Label Grid.Row=&quot;0&quot; Grid.Column=&quot;0&quot; Text=&quot;{Binding daily[3].date_time, StringFormat=&#039;{0:M}&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;15&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                                                    &lt;Image Grid.Row=&quot;1&quot; Grid.Column=&quot;0&quot; Source=&quot;{Binding daily[3].weather[0].icon_url}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot;\/&gt;\n                                                    &lt;Label Grid.Row=&quot;2&quot; Grid.Column=&quot;0&quot; Text=&quot;{Binding daily[3].temp.day, StringFormat=&#039;{0:N0}\u00b0&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;25&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                                                &lt;\/StackLayout&gt;\n                                            &lt;\/pancakeview:PancakeView&gt;\n                                            &lt;pancakeview:PancakeView Grid.Column=&quot;3&quot;  WidthRequest=&quot;100&quot; HeightRequest=&quot;175&quot;  CornerRadius=&quot;10&quot; BackgroundColor=&quot;#FFF&quot;&gt;\n                                                &lt;StackLayout  Margin=&quot;5&quot;&gt;\n                                                    &lt;Label Grid.Row=&quot;0&quot; Grid.Column=&quot;0&quot; Text=&quot;{Binding daily[4].date_time, StringFormat=&#039;{0:M}&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;15&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                                                    &lt;Image Grid.Row=&quot;1&quot; Grid.Column=&quot;0&quot; Source=&quot;{Binding daily[4].weather[0].icon_url}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot;\/&gt;\n                                                    &lt;Label Grid.Row=&quot;2&quot; Grid.Column=&quot;0&quot; Text=&quot;{Binding daily[4].temp.day, StringFormat=&#039;{0:N0}\u00b0&#039;}&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot; FontSize=&quot;25&quot; FontAttributes=&quot;Bold&quot; TextColor=&quot;#7B7C7D&quot;\/&gt;\n                                                &lt;\/StackLayout&gt;\n                                            &lt;\/pancakeview:PancakeView&gt;\n                                        &lt;\/Grid&gt;\n                                    &lt;\/StackLayout&gt;\n                                &lt;\/pancakeview:PancakeView&gt;\n                           &lt;\/Grid&gt;\n                        &lt;\/StackLayout&gt;\n                    &lt;\/DataTemplate&gt;\n                &lt;\/CollectionView.ItemTemplate&gt;\n            &lt;\/CollectionView&gt;\n        &lt;\/StackLayout&gt;\n    &lt;\/ScrollView&gt;\n&lt;\/ContentPage&gt;<\/code><\/pre>\n<p>A\u015fa\u011f\u0131da ayn\u0131 uygulamaya ait iki farkl\u0131 ekran \u00e7\u0131kt\u0131s\u0131 var. Soldaki sadece Xamarin.Forms\u2019un kendi denetimleriyle olu\u015fturdu\u011fum g\u00f6r\u00fcn\u00fcmlerin ekran \u00e7\u0131kt\u0131s\u0131. Basit ve sade. Sa\u011fdaki ise PancakeView ile olu\u015fturdu\u011fum sayfan\u0131n ekran \u00e7\u0131kt\u0131s\u0131. B\u00f6ylece ilkinden \u015f\u0131k ve okunakl\u0131 g\u00f6r\u00fcn\u00fcmler elde ettim.<\/p>\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" alt=\"Xamarin.Forms Hava Durumu Uygulamas\u0131\" class=\"wp-image-227\" data-lazyloaded=\"1\" data-sizes=\"(max-width: 256px) 100vw, 256px\" data-src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png\" data-srcset=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png 512w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-150x300.png 150w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-768x1536.png 768w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-1024x2048.png 1024w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi.png 1080w\" height=\"512\" src=\"image\/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=\" width=\"256\" \/><figcaption>Xamarin.Forms Hava Durumu Uygulamas\u0131<\/figcaption><\/figure>\n<\/div>\n<\/div>\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" alt=\"Xamarin.Forms PancakeView Hava Durumu Uygulamas\u0131\" class=\"wp-image-237\" data-lazyloaded=\"1\" data-sizes=\"(max-width: 256px) 100vw, 256px\" data-src=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-PancakeView-Hava-Durumu-Uygulamasi-512x1024.png\" data-srcset=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-PancakeView-Hava-Durumu-Uygulamasi-512x1024.png 512w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-PancakeView-Hava-Durumu-Uygulamasi-150x300.png 150w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-PancakeView-Hava-Durumu-Uygulamasi-768x1536.png 768w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-PancakeView-Hava-Durumu-Uygulamasi-1024x2048.png 1024w, https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-PancakeView-Hava-Durumu-Uygulamasi.png 1080w\" height=\"512\" src=\"image\/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs=\" width=\"256\" \/><figcaption>Xamarin.Forms PancakeView Hava Durumu Uygulamas\u0131<\/figcaption><\/figure>\n<\/div>\n<\/div>\n<\/div>\n<h2 class=\"wp-block-heading\"><span id=\"Sonuc\">Sonu\u00e7<\/span><\/h2>\n<p><strong>PancakeView<\/strong>\u00a0eklentisini\u00a0kullanarak mevcut Xamarin.Forms denetimleriyle yapamayaca\u011f\u0131n\u0131z bir\u00e7ok \u00f6zelle\u015ftirme yapabilirsiniz. Ben de Xamarin.Forms ile geli\u015ftirdi\u011fim mobil uygulamalarda s\u0131kl\u0131kla kullan\u0131yorum.\u00a0<\/p>\n<p>Bu yaz\u0131mda Xamarin projesinde PancakeView eklentisinin nas\u0131l y\u00fcklenip kullan\u0131laca\u011f\u0131n\u0131 anlatt\u0131m.\u00a0Konuyu \u00f6rneklerle de peki\u015ftirmeye \u00e7al\u0131\u015ft\u0131m.\u00a0Umar\u0131m faydal\u0131 olmu\u015ftur.<\/p>\n<p><!-- AI CONTENT END 1 -->\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Bir Xamarin projesinde g\u00f6r\u00fcn\u00fcmleriniz i\u00e7in degradelere, kenarl\u0131klara, yuvarlat\u0131lm\u0131\u015f k\u00f6\u015felere ve g\u00f6lgelere ihtiyac\u0131n\u0131z varsa, PancakeView eklentisi tam size g\u00f6re. PancakeView eklentisi ile mevcut Xamarin.Forms denetimleri<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_coblocks_attr":"","_coblocks_dimensions":"","_coblocks_responsive_height":"","_coblocks_accordion_ie_support":"","footnotes":""},"categories":[575],"tags":[576,577,578,579,580,581,574,42,570,582,19,28,4,15,5],"class_list":["post-5009","post","type-post","status-publish","format-standard","hentry","category-turkish","tag-net-maui","tag-algoritma","tag-dependencyservice","tag-giris-ekrani","tag-kaynak-sozlukleri","tag-malzeme-temasi","tag-monkeycache","tag-mvvm","tag-nuget","tag-onboarding-screen","tag-sqlite","tag-syncfusion","tag-xamarin","tag-xamarin-android","tag-xamarin-forms"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.0 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Xamarin.Forms PancakeView Eklentisi Kullan\u0131m\u0131 - Serkan Seker TR<\/title>\n<meta name=\"robots\" content=\"noindex, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Xamarin.Forms PancakeView Eklentisi Kullan\u0131m\u0131 - Serkan Seker TR\" \/>\n<meta property=\"og:description\" content=\"Bir Xamarin projesinde g\u00f6r\u00fcn\u00fcmleriniz i\u00e7in degradelere, kenarl\u0131klara, yuvarlat\u0131lm\u0131\u015f k\u00f6\u015felere ve g\u00f6lgelere ihtiyac\u0131n\u0131z varsa, PancakeView eklentisi tam size g\u00f6re. PancakeView eklentisi ile mevcut Xamarin.Forms denetimleri\" \/>\n<meta property=\"og:url\" content=\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/\" \/>\n<meta property=\"og:site_name\" content=\"Serkan Seker TR\" \/>\n<meta property=\"article:published_time\" content=\"2021-01-30T09:28:07+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png\" \/>\n<meta name=\"author\" content=\"serkanadmin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"serkanadmin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"18 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/\"},\"author\":{\"name\":\"serkanadmin\",\"@id\":\"https:\/\/serkanseker.com\/tr\/#\/schema\/person\/841fcc69b248e08e52c4190963caeaf5\"},\"headline\":\"Xamarin.Forms PancakeView Eklentisi Kullan\u0131m\u0131\",\"datePublished\":\"2021-01-30T09:28:07+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/\"},\"wordCount\":1378,\"commentCount\":0,\"image\":{\"@id\":\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png\",\"keywords\":[\".net maui\",\"algoritma\",\"DependencyService\",\"giri\u015f ekran\u0131\",\"kaynak s\u00f6zl\u00fckleri\",\"malzeme temas\u0131\",\"MonkeyCache\",\"MVVM\",\"NuGet\",\"onboarding screen\",\"sqlite\",\"syncfusion\",\"xamarin\",\"xamarin.android\",\"xamarin.forms\"],\"articleSection\":[\"Turkish\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/\",\"url\":\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/\",\"name\":\"Xamarin.Forms PancakeView Eklentisi Kullan\u0131m\u0131 - Serkan Seker TR\",\"isPartOf\":{\"@id\":\"https:\/\/serkanseker.com\/tr\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png\",\"datePublished\":\"2021-01-30T09:28:07+00:00\",\"author\":{\"@id\":\"https:\/\/serkanseker.com\/tr\/#\/schema\/person\/841fcc69b248e08e52c4190963caeaf5\"},\"breadcrumb\":{\"@id\":\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#primaryimage\",\"url\":\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png\",\"contentUrl\":\"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/serkanseker.com\/tr\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Xamarin.Forms PancakeView Eklentisi Kullan\u0131m\u0131\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/serkanseker.com\/tr\/#website\",\"url\":\"https:\/\/serkanseker.com\/tr\/\",\"name\":\"Serkan Seker TR\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/serkanseker.com\/tr\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/serkanseker.com\/tr\/#\/schema\/person\/841fcc69b248e08e52c4190963caeaf5\",\"name\":\"serkanadmin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/serkanseker.com\/tr\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/93ddc1f96117bf468976afe93a077eda77de96bcdb48dc749903598a546786a3?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/93ddc1f96117bf468976afe93a077eda77de96bcdb48dc749903598a546786a3?s=96&d=mm&r=g\",\"caption\":\"serkanadmin\"},\"sameAs\":[\"https:\/\/serkanseker.com\"],\"url\":\"https:\/\/serkanseker.com\/tr\/author\/serkanadmin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Xamarin.Forms PancakeView Eklentisi Kullan\u0131m\u0131 - Serkan Seker TR","robots":{"index":"noindex","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"en_US","og_type":"article","og_title":"Xamarin.Forms PancakeView Eklentisi Kullan\u0131m\u0131 - Serkan Seker TR","og_description":"Bir Xamarin projesinde g\u00f6r\u00fcn\u00fcmleriniz i\u00e7in degradelere, kenarl\u0131klara, yuvarlat\u0131lm\u0131\u015f k\u00f6\u015felere ve g\u00f6lgelere ihtiyac\u0131n\u0131z varsa, PancakeView eklentisi tam size g\u00f6re. PancakeView eklentisi ile mevcut Xamarin.Forms denetimleri","og_url":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/","og_site_name":"Serkan Seker TR","article_published_time":"2021-01-30T09:28:07+00:00","og_image":[{"url":"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png","type":"","width":"","height":""}],"author":"serkanadmin","twitter_card":"summary_large_image","twitter_misc":{"Written by":"serkanadmin","Est. reading time":"18 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#article","isPartOf":{"@id":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/"},"author":{"name":"serkanadmin","@id":"https:\/\/serkanseker.com\/tr\/#\/schema\/person\/841fcc69b248e08e52c4190963caeaf5"},"headline":"Xamarin.Forms PancakeView Eklentisi Kullan\u0131m\u0131","datePublished":"2021-01-30T09:28:07+00:00","mainEntityOfPage":{"@id":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/"},"wordCount":1378,"commentCount":0,"image":{"@id":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#primaryimage"},"thumbnailUrl":"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png","keywords":[".net maui","algoritma","DependencyService","giri\u015f ekran\u0131","kaynak s\u00f6zl\u00fckleri","malzeme temas\u0131","MonkeyCache","MVVM","NuGet","onboarding screen","sqlite","syncfusion","xamarin","xamarin.android","xamarin.forms"],"articleSection":["Turkish"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/","url":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/","name":"Xamarin.Forms PancakeView Eklentisi Kullan\u0131m\u0131 - Serkan Seker TR","isPartOf":{"@id":"https:\/\/serkanseker.com\/tr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#primaryimage"},"image":{"@id":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#primaryimage"},"thumbnailUrl":"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png","datePublished":"2021-01-30T09:28:07+00:00","author":{"@id":"https:\/\/serkanseker.com\/tr\/#\/schema\/person\/841fcc69b248e08e52c4190963caeaf5"},"breadcrumb":{"@id":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#primaryimage","url":"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png","contentUrl":"https:\/\/www.serkanseker.com\/tr\/wp-content\/uploads\/2021\/01\/Xamarin-Forms-Hava-Durumu-Uygulamasi-512x1024.png"},{"@type":"BreadcrumbList","@id":"https:\/\/serkanseker.com\/tr\/xamarin-forms-pancakeview-eklentisi-kullanimi\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/serkanseker.com\/tr\/"},{"@type":"ListItem","position":2,"name":"Xamarin.Forms PancakeView Eklentisi Kullan\u0131m\u0131"}]},{"@type":"WebSite","@id":"https:\/\/serkanseker.com\/tr\/#website","url":"https:\/\/serkanseker.com\/tr\/","name":"Serkan Seker TR","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/serkanseker.com\/tr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/serkanseker.com\/tr\/#\/schema\/person\/841fcc69b248e08e52c4190963caeaf5","name":"serkanadmin","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/serkanseker.com\/tr\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/93ddc1f96117bf468976afe93a077eda77de96bcdb48dc749903598a546786a3?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/93ddc1f96117bf468976afe93a077eda77de96bcdb48dc749903598a546786a3?s=96&d=mm&r=g","caption":"serkanadmin"},"sameAs":["https:\/\/serkanseker.com"],"url":"https:\/\/serkanseker.com\/tr\/author\/serkanadmin\/"}]}},"_links":{"self":[{"href":"https:\/\/serkanseker.com\/tr\/wp-json\/wp\/v2\/posts\/5009","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/serkanseker.com\/tr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/serkanseker.com\/tr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/serkanseker.com\/tr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/serkanseker.com\/tr\/wp-json\/wp\/v2\/comments?post=5009"}],"version-history":[{"count":0,"href":"https:\/\/serkanseker.com\/tr\/wp-json\/wp\/v2\/posts\/5009\/revisions"}],"wp:attachment":[{"href":"https:\/\/serkanseker.com\/tr\/wp-json\/wp\/v2\/media?parent=5009"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/serkanseker.com\/tr\/wp-json\/wp\/v2\/categories?post=5009"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/serkanseker.com\/tr\/wp-json\/wp\/v2\/tags?post=5009"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}