ContentScale ve Kırpma
Görselleri düzgün biçimde sığdırın, doldurun ve kırpın.
ContentScale ve Kırpma, CoddyKit'te ücretsiz bir Jetpack Compose Academy dersidir. Bu, 4 dersinin 3. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Jetpack Compose Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Jetpack Compose Academy kursu toplamda 4 dersten oluşur.
Bu dersin bazı bölümleri henüz çevrilmemiş olup İngilizce olarak gösterilmektedir.
When Image and Box Disagree
Your image has its own aspect ratio, but your layout slot has another. ContentScale decides how the picture fits into that space.
The Aspect Ratio Problem
Force a wide photo into a square and it can stretch or squash. ContentScale gives you sane rules so pictures never look distorted by accident.
Crop Fills and Trims
The most common choice is ContentScale.Crop. It fills the whole slot and trims any overflow, so the frame is always full with no gaps.
Image(painter = p, contentDescription = null,
contentScale = ContentScale.Crop)Fit Shows Everything
ContentScale.Fit shrinks the image until it all fits inside the slot. Nothing is cut off, but you may see empty space on two sides.
FillBounds Can Distort
ContentScale.FillBounds stretches the image to fill both dimensions exactly. It guarantees no gaps but will warp the aspect ratio.
Width or Height Only
Need to fill just one axis? FillWidth and FillHeight scale to match that single dimension while keeping the ratio.
Inside Crops, None Does Not
Inside only shrinks when too big and never enlarges, while None draws at original size, cropping if it overflows.
Crop Needs a Bounded Size
Crop only has an effect when the Image has fixed bounds. Give it a size or fillMaxWidth with a height, or there is nothing to crop into.
Image(painter = p, contentDescription = null,
modifier = Modifier.size(120.dp), contentScale = ContentScale.Crop)Align Within the Frame
When Fit leaves empty space, the alignment argument decides where the image sits, such as Center or TopStart.
Image(painter = p, contentDescription = null, alignment = Alignment.TopCenter)Crop for Thumbnails
Thumbnails and avatars almost always use Crop. It guarantees a clean, gap-free tile no matter the source photo dimensions.
Pick by Intent
Choose by what matters: use Fit when the whole image must be visible, and Crop when a full, edge-to-edge frame matters more.
Quick Check
You want an avatar tile that is always completely filled with no empty space. Which ContentScale fits best?
Recap: Scaling Images
You can now choose ContentScale wisely: Crop to fill, Fit to show all, and align the result. Next: clipping into shapes! 🔲
Sıkça Sorulan Sorular
“ContentScale ve Kırpma” dersi ücretsiz mi?
Evet — “ContentScale ve Kırpma” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Jetpack Compose Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Jetpack Compose Academy kursu toplamda 4 dersten oluşur.
“ContentScale ve Kırpma” dersinde ne öğreneceğim?
Görselleri düzgün biçimde sığdırın, doldurun ve kırpın. Jetpack Compose Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.
Jetpack Compose Academy öğrenmeye başlamak için deneyim gerekli mi?
Önceden deneyim gerekmez. CoddyKit'te Jetpack Compose Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 3. dersidir.
“ContentScale ve Kırpma” dersi ne kadar sürer?
Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.
Bu Jetpack Compose Academy dersinde kod yazıp çalıştırabilir miyim?
Evet. Her Jetpack Compose Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.
Bu kursun tüm dersleri
- Image Composable'ı
- Icon ile Material Simgeleri
- ContentScale ve Kırpma
- Görsellerinizi Kırpma ve Şekillendirme