Understøttelse/justering af tekststørrelse på forskellige skærmstørrelser i Android

Hvis du udvikler mobilapplikationer specifikt i Android, er jeg ret sikker på, at du har haft problemer med at gøre indholdet af dine applikationer dynamisk, især tekststørrelsen. Jeg har arbejdet på Android-applikationer i temmelig lang tid, og jeg har ikke fundet nogen officiel dokumentation om understøttelse af forskellige tekststørrelser i henhold til enhedens skærm, der er dog nogle officielle ressourcer, der beskriver brugen af TextView med understøttende tekststørrelse som defineret i sp-enheden, f.eks. android:textSize=”12sp”.

Ingen tvivl om, at alle udviklere har brugt denne tilgang til at opnå den dynamiske tekststørrelse, der understøtter den enhed, som applikationen kører på.

I dag vil jeg dele min erfaring med, hvordan jeg opnåede dynamisk tekststørrelse i android applikationer, med denne tilgang kan du justere ikke bare tekststørrelse også størrelsen af andre visninger.

Lad os dykke ned i vores tilgang til dynamisk tekstView-størrelse💪🏼

Hvis du ikke har dimen.xml-fil i dit projekt allerede, så opret en ved at følge nedenstående trin:

  • Højreklik på din values-mappe
  • Vælg New
  • Vælg Values Resource File

  • Så opretter du en fil dimen.xml

  • Definer en dimensionsressource i dimen.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="textSizeTitle">@dimen/_22sdp</dimen>
</resources>

Når du vil tilføje dimen ressource vil der være fejl på @dimen/_22sdp bekymre dig ikke om det, vi vil rette det i de næste trin.

Opretning af meta.xml-fil:

Denne fil vil blive brugt som en reference for de forskellige varianter eller kvalifikationsmuligheder, som android-enheden besidder, som applikationen kører på.

  • Opret en ny Ressourcefil med værdier igen
  • Nævn den som meta, men tryk ikke på ok i dialogen endnu
  • Klik på tæthedskvalifikatoren fra listen i venstre side

  • Vælg nu den knap, der har større end-tegn som >>, så vil du se noget som dette

  • Vælg Medium Density og tryk ok

Android Studio understøtter forskellige kvalifikatorer, hvoraf en af dem er density, som vi lige har brugt ovenfor. Gentag nu trinnet for at oprette meta.xml-filen og tilføj alle følgende kvalifikationselementer for tæthed:

  • High Density
  • X-High Density
  • XX-High Density
  • XXX-High Density

Næste gang opretter du en anden meta.xml fil og denne gang bruger du size qualifier fra venstre side og vælger X-Large muligheder.

Nu vil vi oprette endnu en meta.xml-fil med en anden kvalifikator, nemlig Smallest Screen Width som vist nedenfor

Når du klikker på Smallest Screen Width kvalifikator, får du mulighed for at definere den mindste bredde i dp som vist nedenfor

Klik derefter på OK-knappen.

Vi vil oprette flere meta.xml-fil med følgende mindste breddestørrelser:

  • 300
  • 330
  • 360
  • 390
  • … opret filer med en forskel på 30, indtil du når 780

Spørgsmålet her er, hvad der ville være i disse filer, ja, vi vil tilføje string ressource i alle meta filer i de næste trin.

I venstre rude i Android Studio har du disse filer som vist nedenfor:

Hver fil viser sin kvalifikator på højre side af meta.xml-navnet, skal du åbne hver fil og placere følgende strengressource.

meta.xml (hdpi)

<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="dimension">values-hdpi</string>
</resources>

Åbn hver meta.xml-fil og ovennævnte ressource, men du skal ændre værdierne-hdpi-værdien med værdier-{her skal du bruge kvalifikator for den respektive fil}. Desuden kan du tjekke disse filer på github.

  • meta.xml(hdpi)
  • meta.xml(mdpi)
  • meta.xml(xhdpi)
  • meta.xml(xxhdpi)
  • meta.xml(xxxhdpi)
  • meta.xml(xlarge)
  • meta.xml(sw300dp)
  • meta.xml(sw330dp)
  • meta.xml(sw360dp)
  • meta.xml(sw360dp)
  • meta.xml(sw390dp)
  • meta.xml(sw420dp)
  • meta.xml(sw450dp)
  • meta.xml(sw480dp)
  • meta.xml(sw510dp)
  • meta.xml(sw510dp)
  • meta.xml(sw540dp)
  • meta.xml(sw570dp)
  • meta.xml(sw600dp)
  • meta.xml(sw630dp)
  • meta.xml(sw660dp)
  • meta.xml(sw660dp)
  • meta.xml(sw690dp)
  • meta.xml(sw720dp)
  • meta.xml(sw750dp)
  • meta.xml(sw780dp)

Det er ikke færdigt endnu, der er flere filer, vi har brug for, som er sdp.xml, opret denne fil med alle de kvalifikatorer, som vi har oprettet før for meta.xml,, når du er færdig med at oprette alle disse filer af sdp.xml med alle kvalifikatorer, så kan du finde indholdet af disse filer på github. sdp

  • sdp.xml(hdpi)
  • sdp.xml(mdpi)
  • sdp.xml(xhdpi)
  • sdp.xml(xxhdpi)
  • sdp.xml(xxhdpi)
  • sdp.xml(xxxhdpi)
  • sdp.xml(xlarge)
  • sdp.xml(sw300dp)
  • sdp.xml(sw330dp)
  • sdp.xml(sw360dp)
  • sdp.xml(sw360dp)
  • sdp.xml(sw390dp)
  • sdp.xml(sw420dp)
  • sdp.xml(sw450dp)
  • sdp.xml(sw480dp)
  • sdp.xml(sw510dp)
  • sdp.xml(sw510dp)
  • sdp.xml(sw540dp)
  • sdp.xml(sw570dp)
  • sdp.xml(sw600dp)
  • sdp.xml(sw630dp)
  • sdp.xml(sw660dp)
  • sdp.xml(sw660dp)
  • sdp.xml(sw690dp)
  • sdp.xml(sw720dp)
  • sdp.xml(sw750dp)
  • sdp.xml(sw780dp)

Og det er alt for opsætningen nu skal du bare bruge disse dimensionsværdier, som du allerede har defineret i dimen.xml filen, som vi har diskuteret i starten af denne blog.

Brug

Givet at du har defineret en dimen-værdi som:

<dimen name="textSizeTitle">@dimen/_22sdp</dimen>

Du kan bruge den hvor som helst i dine layouts xml-filer:

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
<!-- // here is the dimen value that will support different screen size-->
android:textSize="@dimen/textSizeTitle"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />

Prøv at køre din app i forskellige emulatorer, der har forskellige skærmdimensioner og tæthed, vil du se, at tekststørrelsen justerer sig selv i henhold til den enhed, som applikationen kører på.

Og det er alt dit nu 🥳

Tak for at læse, og jeg håber, at din tilstedeværelse her var ressourcefuld 😎

Du kan også tjekke min anden historie om Styling/Designing TextField i Jectpack Compose UI – Android

Kamran Ramzan er studerende på Software Engineering og arbejder som Full Stack Mobile Application Developer. Han udforsker konstant nye teknologier og deler viden med jer i håb om, at det vil hjælpe på en eller anden måde.

Kindly hit the clap again and again 😇 hvis du kan lide min indsats 👏🏼

Skriv en kommentar