ContentScale og beskæring
Tilpas, udfyld og beskær billeder korrekt.
ContentScale og beskæring er en gratis Jetpack Compose Academy-lektion på CoddyKit. Dette er lektion 3 af 4. Du kan læse hele lektionen gratis nedenfor — og derefter øve dig praktisk i browseren med en indbygget kodeeditor og en AI-vejleder, der er tilgængelig døgnet rundt. Den er en del af læringsforløbet i Jetpack Compose Academy, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. Jetpack Compose Academy-kurset indeholder 4 lektioner i alt.
Når Image og Box er uenige
Dit billede har sit eget højde-bredde-forhold, mens pladsen i dit layout har et andet. ContentScale bestemmer, hvordan billedet tilpasses pladsen.
Problemet med højde-bredde-forholdet
Hvis du tvinger et bredt foto ind i en firkant, kan det blive strakt eller klemt. ContentScale giver dig fornuftige regler, så billeder ikke ved et uheld bliver forvrænget.
Crop udfylder og beskærer
Det mest almindelige valg er ContentScale.Crop. Den udfylder hele pladsen og beskærer alt, der rager ud, så rammen altid er helt fyldt uden mellemrum.
Image(painter = p, contentDescription = null,
contentScale = ContentScale.Crop)Fit viser alt
ContentScale.Fit gør billedet mindre, indtil det hele passer i pladsen. Intet bliver beskåret, men der kan være tom plads på to sider.
FillBounds kan forvrænge
ContentScale.FillBounds strækker billedet, så det præcis udfylder begge dimensioner. Det garanterer, at der ikke er mellemrum, men ændrer højde-bredde-forholdet.
Kun bredde eller højde
Har du kun brug for at udfylde én akse? FillWidth og FillHeight skalerer, så den ene dimension passer, mens forholdet bevares.
Inside beskærer, None gør ikke
Inside gør kun billedet mindre, når det er for stort, og forstørrer det aldrig, mens None tegner det i den oprindelige størrelse og beskærer det, hvis det rager ud.
Crop kræver en afgrænset størrelse
Crop har kun en effekt, når Image har faste grænser. Giv det en size eller fillMaxWidth med en højde, ellers er der ikke noget at beskære ind i.
Image(painter = p, contentDescription = null,
modifier = Modifier.size(120.dp), contentScale = ContentScale.Crop)Justér inden for rammen
Når Fit efterlader tom plads, bestemmer argumentet alignment, hvor billedet placeres, f.eks. Center eller TopStart.
Image(painter = p, contentDescription = null, alignment = Alignment.TopCenter)Brug Crop til miniaturebilleder
Miniaturebilleder og avatarer bruger næsten altid Crop. Det garanterer et rent felt uden mellemrum, uanset kildebilledets mål.
Vælg efter formålet
Vælg ud fra det, der er vigtigt: Brug Fit, når hele billedet skal være synligt, og Crop, når en fuld ramme fra kant til kant er vigtigere.
Hurtigt tjek
Du vil have en avatar, der altid er helt udfyldt uden tom plads. Hvilken ContentScale passer bedst?
Opsummering: Skalering af billeder
Du kan nu vælge ContentScale med omtanke: Crop til udfyldning, Fit til at vise alt og alignment til at placere resultatet. Næste emne: beskæring til figurer! 🔲
Lær Kotlin med en AI-underviser — gratis
Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.
- Kurser
- 30
- Lektioner
- 120
Ofte stillede spørgsmål
Er lektionen “ContentScale og beskæring” gratis?
Ja — hele teksten til “ContentScale og beskæring” kan læses gratis her på nettet. Hvis du vil øve dig interaktivt med en indbygget kodeeditor og en AI-vejleder døgnet rundt og få adgang til resten af Jetpack Compose Academy-kurset, skal du opgradere til CoddyKit PRO. Jetpack Compose Academy-kurset indeholder 4 lektioner i alt.
Hvad lærer jeg i “ContentScale og beskæring”?
Tilpas, udfyld og beskær billeder korrekt. Du øver dig i Jetpack Compose Academy med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.
Skal jeg have erfaring for at begynde på Jetpack Compose Academy?
Der kræves ingen tidligere erfaring. Jetpack Compose Academy på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 3 af 4.
Hvor lang tid tager lektionen “ContentScale og beskæring”?
De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.
Kan jeg skrive og køre kode i denne Jetpack Compose Academy-lektion?
Ja. Alle Jetpack Compose Academy-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.
Alle lektioner i dette kursus
- Image-Composable
- Material Icons med Icon
- ContentScale og beskæring
- Klip og form dine billeder