Xamarin Forms Resimlerde Oran Ayarlamak

Merhaba arkadaşlar.  Bu yazımızda Xamarin Forms ile bir sunucudan fotoğraf çektikten sonra en boy oranını ayarlama işlemi yapacağız. Bu işlem bazen bizim için çok önemli oluyor. Bne bu sıkıntıyı ListView içerisinde yaşamıştım. ListView içerisinde göstereceğim resimlerin uzunlukları birbirinden farklıydı. Buna göre resimi kenarlarında boşluk kalmadan uzunluğunu ayarlamamız gerekiyordu.

İlk önce göstereceğimiz resimlerin FFCacheImage paketinde göstermemiz gerekiyor. Fotoğraflar genelde Url’den geldiği için bu View’in Success fonksiyonun yararlanacağız. Bu fonksiyonu kullanma sebebimiz fotoğrafı url’den çektikten sonra resimin genişlik ve yükseklik bilgisini alabiliyoruz.

İlk önce ekranın genişliğini almalıyız. Böylece ekranın genişliğini göre resimin uzunluğunu ayarlayabileceğiz. Ekranın genişliğini almamız için her sayfada bir override fonksiyon mevcut. OnSizeAllocated fonksiyonu ile ekranın genişliğini alıp bunu sayfa içerisinde oluşturduğum değişkenlere atıyorum.

protected override void OnSizeAllocated(double width, double height)
        {
            base.OnSizeAllocated(width, height);
            screenHeight = height;
            screenWidth = width;
        }

Ardından Success metodunu ekliyorum. Burada ilk önce ekranda boşluğum var ise Url’de ki resimin genişliğini ekranın genişliğinden kenar boşluklarını çıkararak buluyorum. Ardından resimin orijinal oranını buluyorum. Oranı bulmak için orijinal genişlik bölü yükseklik yaptığımda bulabiliyorum. Bundan sonrası ise ekranının genişliğinden kenar boşluklarını çıkarıp buludğum genişliği orijinal oran ile bölüyorum, böylece ekrana göre bir yükseklik buluyorum.

private void CachedImage_Success(object sender, CachedImageEvents.SuccessEventArgs e)
        {
            if (screenWidth != -1 && screenHeight != -1)
            {
                for (int i = 0; i < announcements.Data.Count; i++)
                {
                    if (announcements.Data[i].ImageUrl == e.ImageInformation.Path)
                    {
                        announcements.Data[i].Width = screenWidth - 20;
                        var ratio = e.ImageInformation.OriginalWidth / (screenWidth - 20);
                        announcements.Data[i].Height = e.ImageInformation.OriginalHeight / ratio;
                        if (e.LoadingResult != FFImageLoading.Work.LoadingResult.MemoryCache)
                        {
                            listViewAnnouncements.ItemHeightChanged(i);
                        }
                    }
                }
            }
        }

Bundan sonrası ise ListView içerisinde koyduğumuz FFCacheImage kontrolüne senin boyutun değişti diyip bildiriyorum.

Sorularınız olursa yorum veya mail atarak ulaşabilirsiniz. İyi çalışmalar.