Om du utvecklar mobilapplikationer specifikt i Android är jag ganska säker på att du måste ha haft problem med att göra innehållet i dina applikationer dynamiskt, särskilt textstorleken. Jag har arbetat med Android-applikationer under en ganska lång tid och jag har inte hittat någon officiell dokumentation om stöd för olika textstorlekar beroende på enhetens skärm, men det finns några officiella resurser som beskriver användningen av TextView med stöd för textstorlek enligt sp
-enheten, t.ex. android:textSize=”12sp”.
Det råder ingen tvekan om att alla utvecklare har använt sig av detta tillvägagångssätt för att uppnå den dynamiska textstorlek som stödjer den enhet som applikationen körs på.
I dag kommer jag att dela min erfarenhet av hur jag uppnådde dynamisk textstorlek i Android-applikationer, med detta tillvägagångssätt kan du justera inte bara textstorlek även storleken på andra vyer.
Låt oss dyka in i vårt tillvägagångssätt av Dynamic TextView size💪🏼
Om du inte har dimen.xml-fil i ditt projekt så skapa en genom att följa nedanstående steg:
- Högerklicka på din värderingsmapp
- Välj New
- Välj Values Resource File
- Skapa sedan en fil dimen.xml
- Definiera en dimensionsresurs i dimen.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="textSizeTitle">@dimen/_22sdp</dimen>
</resources>
När du lägger till dimenresursen kommer det att uppstå ett fel på @dimen/_22sdp
Oroa dig inte för det, det löser vi i nästa steg.
Skapa filen meta.xml:
Denna fil kommer att användas som en referens för de olika varianter eller kvalificeringar som android-enheten besitter som programmet körs på.
- Skapa en ny resursfil för värden igen
- Nämn den som meta, men tryck inte på ok i dialogrutan än
- Klicka på density qualifier från listan till vänster
- Välj nu den knapp som har större än tecken som >>, Då kommer du att se något som liknar detta
- Välj Medium Density och tryck på ok
Android Studio har stöd för olika kvalifikationsbeteckningar, varav en av dem är Density, som vi just använt ovan. Upprepa nu steget för att skapa filen meta.xml och lägg till alla följande kvalificerare för densitet:
- High Density
- X-High Density
- XX-High Density
- XXX-High Density
Nästan skapa en annan meta.xml-fil och den här gången använder du size qualifier på vänster sida och väljer X-Large-alternativ.
Nu skapar vi en annan meta.xml-fil med en annan qualifier som är Smallest Screen Width
som visas nedan
När du klickar på Smallest Screen Width
. får du möjlighet att definiera den minsta bredden i dp enligt nedan
Klicka sedan på OK-knappen.
Vi kommer att skapa fler meta.xml-fil med följande minsta breddstorlekar:
- 300
- 330
- 360
- 390
- …
- …
- …
- … skapa filer med en skillnad på 30 tills du når 780
Frågan är vad som skulle finnas i dessa filer, vi kommer att lägga till en strängresurs i alla metafiler i nästa steg.
I den vänstra rutan i Android Studio har du dessa filer som visas nedan:
Varje fil visar sin kvalificerare på den högra sidan av meta.xml-namnet, öppna varje fil och placera följande strängresurs.
meta.xml (hdpi)
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="dimension">values-hdpi</string>
</resources>
Öppna varje meta.xml-fil och ovan nämnda resurs, men du måste ändra värdena-hdpi-värdet med värden-{här använder du kvalifikationen för respektive fil}. Dessutom kan du kontrollera dessa 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(sw390dp)
- meta.xml(sw420dp)
- meta.xml(sw450dp)
- meta.xml(sw480dp)
- meta.xml(sw510dp)
- meta.xml(sw540dp)
- meta.xml(sw570dp)
- meta.xml(sw600dp)
- meta.xml(sw630dp)
- meta.xml(sw660dp)
- meta.xml(sw690dp)
- meta.xml(sw720dp)
- meta.xml(sw750dp)
- meta.xml(sw780dp)
Det är inte färdigt än, det finns fler filer som vi behöver, vilket är sdp.xml,
skapa den här filen med alla de kvalificerare som vi har skapat tidigare för meta.xml,
när du väl är klar med att skapa alla dessa filer av sdp.xml
med alla kvalificerare kan du hitta innehållet i dessa filer på github. sdp
- sdp.xml(hdpi)
- sdp.xml(mdpi)
- sdp.xml(xhdpi)
- sdp.xml(xxhdpi)
- sdp.xml(xxxhdpi)
- sdp.xml(xlarge)
- sdp.xml(sw300dp)
- sdp.xml(sw330dp)
- sdp.xml(sw360dp)
- sdp.xml(sw390dp)
- sdp.xml(sw420dp)
- sdp.xml(sw450dp)
- sdp.xml(sw480dp)
- sdp.xml(sw510dp)
- sdp.xml(sw540dp)
- sdp.xml(sw570dp)
- sdp.xml(sw600dp)
- sdp.xml(sw630dp)
- sdp.xml(sw660dp)
- sdp.xml(sw690dp)
- sdp.xml(sw720dp)
- sdp.xml(sw750dp)
- sdp.xml(sw780dp)
Och det var allt för inställningen nu behöver du bara använda dessa dimensioner som du redan har definierat i dimen.xml-filen som vi har diskuterat i början av denna blogg.
Användning
Med tanke på att du har definierat ett dimen-värde som:
<dimen name="textSizeTitle">@dimen/_22sdp</dimen>
Du kan använda det var som helst i dina layouter 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" />
Prova att köra din app i olika emulatorer som har olika skärmdimensioner och täthet, så kommer du att se att textstorleken justerar sig själv beroende på den enhet som programmet körs på.
Och det är allt ditt nu 🥳
Tack för att du läste och jag hoppas att din närvaro här var resursfull 😎
Du kan också kolla min andra berättelse om Styling/Designing TextField i Jectpack Compose UI – Android
Kamran Ramzan är en student i Software Engineering som jobbar som utvecklare av en fullstack mobil applikation. Han utforskar ständigt ny teknik och delar kunskapen med er i hopp om att det hjälper på något sätt.
Kindly hit the clap again and again 😇 if you like my efforts 👏🏼
.