Jos kehität mobiilisovelluksia nimenomaan Androidissa, olen melko varma, että sinulla on ollut vaikeuksia tehdä sovelluksesi sisällöstä dynaamista, erityisesti tekstikokoa. Olen työskennellyt Android-sovellusten parissa melko pitkään, enkä ole löytänyt mitään virallista dokumentaatiota eri tekstikokojen tukemisesta laitteen näytön mukaan, on kuitenkin olemassa joitakin virallisia resursseja, joissa kuvataan TextView:n käyttöä tekstikokoa tukevalla tekstikoolla, joka on määritelty sp-yksikössä, esim. android:textSize=”12sp”.
Epäilemättä jokainen kehittäjä on käyttänyt tätä lähestymistapaa saavuttaakseen dynaamisen tekstin koon, joka tukee laitetta, jossa sovellusta käytetään.
Tänään jaan kokemukseni siitä, miten saavutin dynaamisen tekstikoon android-sovelluksissa, tällä lähestymistavalla voit säätää paitsi tekstikokoa myös muiden näkymien kokoa.
Sukelletaanpa lähestymistapaamme dynaamisen tekstinäkymän kokoon💪🏼
Jos sinulla ei ole dimen.xml-tiedostoa projektissasi jo, luo sellainen noudattamalla alla mainittuja vaiheita:
- Klikkaa hiiren kakkospainikkeella arvot-kansiota
- Valitse Uusi
- Valitse Arvot-resurssitiedosto
2046>
- >>Valmistu sitten tiedosto dimen.xml
- Määrittele dimensioresurssi dimen.xml:ssä
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="textSizeTitle">@dimen/_22sdp</dimen>
</resources>
Kun lisäät dimen-resurssin tulee virhe @dimen/_22sdp älä huoli siitä korjaamme sen seuraavissa vaiheissa.
Meta.xml-tiedoston luominen:
Tätä tiedostoa käytetään viitteenä eri variantteihin tai ominaisuuksiin, joita android-laitteella on, jolla sovellus toimii.
- Luo jälleen uusi Values Resource File
- Nimeä se meta, mutta älä paina vielä ok-painiketta valintaikkunassa
- Klikkaa vasemmanpuoleisesta listasta tiheysominaisuutta
- Valitse nyt painike, jossa on suurempi kuin -merkki, kuten >>, niin näet jotain tällaista
- Valitse Medium Density (keskitiheys) ja paina ok
Android Studio tukee erilaisia määritteitä, joista yksi on density (tiheys), jota käytimme juuri edellä. Toista nyt vaihe meta.xml-tiedoston luomiseksi ja lisää kaikki seuraavat tiheyden määritteet:
- Korkea tiheys
- X-Korkea tiheys
- XX-Korkea tiheys
- XXX-Korkea tiheys
Luo seuraavaksi toinen meta.xml-tiedosto ja tällä kertaa käytämme vasemmalta puolelta size qualifieria ja valitsemme X-Large-vaihtoehdot.
Nyt luomme toisen meta.xml-tiedoston eri määritteellä, joka on Smallest Screen Width kuten alla näkyy
Kun klikkaat Smallest Screen Width. määrettä näet mahdollisuuden määritellä pienimmän leveyden dp:nä alla esitetyllä tavalla
Klikkaa sitten OK-painiketta.
Luomme lisää metatietoja.xml-tiedosto seuraavilla pienimmillä leveyskooilla:
- 300
- 330
- 360
- 390
- …
- …
- …
- … luodaan tiedostoja 30:n erolla kunnes saavutetaan 780
Kysymys tässä kohtaa on, että mitä näissä tiedostoissa olisi, noh lisäämme merkkijonon resurssin kaikkiin metatiedostoihin seuraavissa vaiheissa.
Android Studion vasemmassa ruudussa sinulla on nämä tiedostot alla olevan kuvan mukaisesti:
Jokainen tiedosto näyttää määritteensä oikealla puolella meta.xml-nimi, avaa jokainen tiedosto ja aseta seuraava merkkijono resurssi.
meta.xml (hdpi)
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="dimension">values-hdpi</string>
</resources>
Avaa jokainen meta.xml-tiedosto ja edellä mainittu resurssi, mutta sinun on muutettava arvot-hdpi-arvo arvoilla-{käytä tässä kyseisen tiedoston karsintatunnusta}. Lisäksi voit tarkistaa nämä tiedostot githubista.
- 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)
Ei ole vielä valmista, tarvitsemme vielä lisää tiedostoja, jotka ovat: sdp.xml, Luo tämä tiedosto kaikilla määritteillä, jotka olemme luoneet aiemmin meta.xml,:lle, kun olet luonut kaikki nämä sdp.xml-tiedostot kaikkine määritteineen, niin sitten löydät näiden tiedostojen sisällön githubista. 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)
Ja siinä kaikki asetukset, nyt sinun täytyy vain käyttää näitä dimensioiden arvoja, jotka olet jo määrittänyt dimen.xml-tiedostossa, jota käsittelimme tämän blogin alussa.
Käyttö
Jos olet määritellyt yhden dimen-arvon kuten:
<dimen name="textSizeTitle">@dimen/_22sdp</dimen>
Voit käyttää sitä missä tahansa layouts xml-tiedostoissasi:
<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" />
Kokeile ajaa sovellustasi eri emulaattoreissa, joilla on erilaiset ruudun mitat ja tiheys, huomaat, että tekstin koko säätää itseään sen laitteen mukaan, jossa sovellus toimii.
Ja se on nyt kaikki sinun 🥳
Kiitos lukemisesta ja toivon, että läsnäolosi täällä oli hyödyllinen 😎
Voit myös tarkistaa toisen tarinani aiheesta Tekstikentän muotoilu/suunnittelu Jectpackin Compose UI – Androidissa
Kamran Ramzan on ohjelmistotekniikan opiskelija, joka työskentelee Full Stack -mobiilisovelluskehittäjänä. Hän tutkii jatkuvasti uusia teknologioita ja jakaa tietoa teidän kanssanne toivoen, että se auttaa jotenkin.
Kiltisti lyö taputusta uudestaan ja uudestaan 😇 jos pidät ponnisteluistani 👏🏼