Dodaj tekst korisničkim sučeljima

Možete koristiti nekoliko različitih tekstualnih komponenti za dodavanje teksta za čitanje ili uređivanje u korisnički sučelje, kao što su naslovi ili oznake i polja za unos teksta s tekstom za zamjenu. Komponenta Text dodaje formatirani tekst, komponenta Text Edit dodaje višoredni unos, a komponenta Text Input dodaje jednoredno uređivo polje.

Možete odabrati font koji ćete koristiti i odrediti opsežna svojstva za svaki tekstni niz, kao što su veličina u točkama ili pikselsima, naziv stila, naglasak, poravnanje i razmak.

Za više informacija pogledajte sljedeći videozapis:

Za izradu oznake s pozadinom upotrijebite komponentu Label dostupnu u Components > Qt Quick Controls. Modul također sadrži komponente za izradu kontrola za Text Field i Text Area. One se razlikuju od osnovnih komponenti po tome što im se primjenjuje zajednički stil i što za njih možete navesti tekst za popunjavanje.

Koristite obogaćeni tekst

Možete koristiti obogaćeni tekst u komponentama Text i Text Input. Za otvaranje uređivača obogaćenog teksta odaberite gumb (Edit) u Properties > Character > Text.

U uređivaču obogaćenog teksta možete:

• Naglasiti tekst.
• Stvoriti hiperveze.
• Poravnajte tekst.
• Izraditi numerirane i s popisnim stavkama popise.
• Odredite boju teksta.
• Odaberite font teksta.
• Postavite veličinu fonta.
• Izradite tablice.

Označite nizove za prijevod

Za podršku prevoditeljima označite nizove koji se trebaju prevesti. U Properties > Character > Text odaberite tr.

Po zadanom je tekstualna niz uključena u poziv funkcije qsTr().

Ako koristite tekstne ID-ove umjesto običnog teksta, promijenite zadani poziv u qsTrId(). Odaberite Edit > Preferences > Qt Quick > Qt Quick Designer, a zatim odaberite radio gumb qsTrId() u grupi Internationalization. Za više informacija pogledajte Prijevode temeljene na ID-ovima teksta.

Kako biste sačuvali kontekst pri uređivanju teksta ili promijenili kontekst postavljanjem veze na svojstvo teksta, promijenite zadani poziv na qsTranslate() odabirom radio gumba qsTranslate().

Za više informacija pogledajte pisanje izvornog koda za prijevod.

Svojstva znakova

Možete postaviti svojstva fonta u odjeljku Character u Properties. Za svaki niz koji unesete u polje Text možete odabrati font koji ćete koristiti u polju Font i odrediti veličinu, naglasak, poravnanje i razmak teksta. Odredite veličinu fonta u točkama ili pikselsima u polju Size.

Da biste prikazali prilagođene fontove u popisu dostupnih fontova u polju Font, prvo ih morate dodati u resurse:

1. Odaberite Assets > .
2. Odaberite datoteku fonta, a zatim odaberite Open.
3. Add Resources Odaberite lokaciju na kojoj će se datoteka spremiti u dijaloškom okviru za instalaciju fonta.
4. Odaberite OK.

U polju Weight možete odabrati debljinu fonta s popisa unaprijed definiranih vrijednosti koje se kreću od izrazito svijetle do izrazito podebljane. Također možete koristiti gumbe u grupi Emphasis za formatiranje teksta tako da bude podebljan, kurziv, podcrtan ili s crtom kroz tekst.

Ako u polju Style name postavite naziv stila, font se usklađuje s nazivom stila umjesto s vrijednostima postavljenim u poljima Weight i Emphasis.

Vrijednost polja Word spacing mijenja zadano razmak između pojedinačnih riječi, dok vrijednost polja Letter spacing mijenja razmak između pojedinačnih slova u riječi. Pozitivna vrijednost povećava razmak za odgovarajući broj piksela, dok ga negativna vrijednost smanjuje.

Vrijednost polja Line height postavlja visinu retka za tekst. U polju Line height mode u odjeljku Text Extras odaberite FixedHeight za postavljanje visine retka u piksima ili ProportionalHeight (zadano) za postavljanje razmaka proporcionalno retku (kao množitelj). Na primjer, postavite na 2 za dvostruki razmak.

Poravnanje teksta

Tekstualne komponente možete poravnati vodoravno i okomito. Po zadanom je tekst okomito poravnat prema vrhu. Vodoravno poravnanje prati prirodno poravnanje teksta. Po zadanom je tekst koji se piše s lijeva na desno, poput engleskog, poravnat na lijevu stranu tekstnog područja, dok je tekst koji se piše s desna na lijevo, poput arapskog, poravnat na desnu stranu tekstnog područja.

Tekst možete poravnati ulijevo, udesno, na vrh ili na dno te ga vodoravno ili okomito centrirati. Možete poravnati vodoravni tekst na obje strane.

Za jedan redak teksta, veličina teksta je područje teksta. U ovom uobičajenom slučaju, sva poravnanja su ekvivalentna. Da biste centrirali tekst u njegovom roditelju, upotrijebite privezište ili povežite širinu komponente teksta sa širinom roditelja. Za više informacija pogledajte odjeljak Postavljanje veza.

Boje teksta i stila

Možete postaviti boju samog teksta i sekundarnu boju koju koriste stilovi teksta.

Za komponente Text Edit i Text Input možete postaviti i boju odabranog teksta te boju isticanja teksta koja se koristi iza odabira u poljima Selected text color i Selection color.

Za kontrole Text Field i Text Area možete postaviti i boju teksta mjesta držača.

Za više informacija o odabiru boja pogledajte odjeljak Odabir boja. Za tekstualne komponente možete postaviti samo jednobojne boje.

Napredna svojstva teksta

Visina i širina tekstualne komponente određuju se automatski ovisno o vrijednostima svojstava koje postavite, kako bi se prilagodile duljini niza koji navedete u polju Text i veličini fonta, na primjer. Dodatna svojstva za formatiranje teksta možete navesti u odjeljku Text Extras.

Vrijednost polja Size mode određuje kako se određuje veličina fonta prikazanog teksta. Odaberite FixedSize kako biste koristili veličinu navedenu u polju Size u odjeljku Character u pikselima ili točkama.

Odaberite HorizontalFit ili VerticalFit kako biste koristili najveću veličinu do navedene veličine koja odgovara širini ili visini komponente. Odaberite Fit kako biste koristili najveću veličinu do navedene veličine koja stane unutar širine i visine komponente. Veličina fonta prilagođenog teksta ima donju granicu koju određuje polje Min size i gornju granicu koju određuje polje Size.

Omotavanje i skraćivanje teksta

U polju Wrap mode možete omogućiti prelom teksta na širinu komponente teksta. Tekst će se prelomiti samo ako postavite eksplicitnu širinu za komponentu teksta. Prema zadanim postavkama tekst se ne prelama. Odaberite WordWrap kako biste ograničili prelom samo na granice riječi. Odaberite WrapAnywhere kako biste omogućili prelom u bilo kojem dijelu retka, čak i ako se dogodi usred riječi. Odaberite Wrap kako biste prelomili na granici riječi, ako je moguće, ili na odgovarajućem mjestu retka, čak i usred riječi.

Možete koristiti svojstvo Elide s opcijom Wrap kako biste prilagodili jedan red običnog teksta zadanoj širini. Odaberite ElideRight i postavite Max line count ili visinu komponente teksta (u polju H ). Ako postavite oboje, primijenit će se ograničenje na maksimalni broj redaka, osim ako se redovi ne mogu uklopiti u dopuštenu visinu.

Ako je tekst niz promjenjive duljine i postavite vrijednost svojstva Elide na nešto drugo osim ElideNone, koristit će se prvi niz koji stane, a u suprotnom će se zadnji skratiti.

Nizovi promjenjive duljine poredani su od najdužeg do najkraćeg, odvojeni Unicode znakom za završetak niza U009C.

Format teksta

Tekst može biti u običnom tekstu ili u formatu obogaćenog teksta, ovisno o vrijednosti koju postavite u polju Format. Ako odaberete AutoText, a prvi redak teksta sadrži HTML oznaku, tekst se tretira kao obogaćeni tekst. Obogaćeni tekst podržava podskup HTML 4 opisan u odjeljku Supported HTML Subset. Imajte na umu da obični tekst nudi bolje performanse od obogaćenog teksta.

Prikaži tekst

U polju Render type možete nadjačati zadani tip iscrtavanja za tekstualnu komponentu. Odaberite NativeRendering ako želite da tekst izgleda izvornim na ciljanoj platformi i ne zahtijevate napredne značajke kao što je transformacija teksta. Korištenje rotacije ili skaliranja u kombinaciji s izvornim iscrtavanjem dovodi do loših i ponekad pikseliziranih rezultata.

Ako odaberete NativeRendering, možete postaviti preferenciju hintinga u polju Hinting u odjeljku Font Extras:

• PreferDefaultHinting koristi zadanu razinu hintinga za odredišnu platformu.
• PreferNoHinting prikazuje tekst bez hintanja kontura glifova, ako je moguće.
• PreferVerticalHinting prikazuje tekst bez horizontalnog hintinga, ali poravnava glifove na pikselnoj mreži u vertikalnom smjeru, ako je moguće.
• PreferFullHinting prikazuje tekst s hintingom u horizontalnom i vertikalnom smjeru.

Napredna svojstva fonta

Možete navesti dodatna svojstva za fontove u odjeljku Font Extras.

U polju Capitalization odaberite MixedCase za normalno prikazivanje teksta bez primjene promjena velikih slova. Također možete postaviti tekst u potpuno velikim ili malim slovima ili koristiti mala velika slova. Opcija Capitalize prikazuje prvi znak svake riječi kao veliko slovo.

Možete postaviti stil fonta u polju Style na Outline, Raised ili Sunken. Boja koju odaberete u polju Style color koristi se kao boja obrisa za tekst s obrisom te kao boja sjene za istaknuti tekst.

Za korištenje kerninga pri iscrtavanju teksta odabranim fontom odaberite Auto kerning.

Ponekad font primjenjuje složena pravila na skup znakova kako bi ih ispravno prikazao. U nekim pisamima, kao što su brahmijska pisma, to je potrebno kako bi tekst bio čitljiv, ali u drugima, kao što je latinično pismo, to je samo kozmetička značajka. Takve su značajke prema zadanim postavkama onemogućene radi poboljšanja performansi. Ako su potrebne, odaberite Prefer shaping.

Unos teksta

Možete koristiti komponente Text Edit i Text Input za dodavanje tekstualnih polja u koja korisnici mogu unositi tekst.

Komponenta Text Input prikazuje jedan redak uređivog običnog teksta, dok komponenta Text Edit prikazuje blok uređivog, formatiranog teksta. Obje se komponente koriste za prihvaćanje unosa teksta.

Unesite lozinke

Možete postaviti svojstva za komponente Text Input koja ih čine prikladnima za unos lozinki.

U polju za unos maske ( Input mask ) možete stvoriti masku unosa koja sadrži znakove maske, meta-znakove i razdjelnike između njih. Prilikom stvaranja ili brisanja, tekstualno polje ili unos ispunjava se kopijom niza maske unosa, pri čemu su meta-znakovi uklonjeni, a znakovi maske zamijenjeni praznim znakom. Na primjer, u polju za unos IP adrese mogli biste koristiti sljedeću masku (pri čemu je podcrtavanje prazni znak): 000.000.000.000;_. Za više informacija o izradi maski za unos pogledajte dokumentaciju za QLineEdit::inputMask.

U polju Echo mode odaberite Password kako biste prikazali znakove maske lozinke ovisne o platformi umjesto stvarnih znakova koje korisnici upisuju. Odaberite PasswordEchoOnEdit kako biste prikazali znakove onako kako ih korisnici upisuju. Znak maske prikazuje se u polju Password character.

Unesite tekst

Možete odrediti kako korisnici mogu unositi tekst u polja za uređivanje teksta ili za unos.

U polju Maximum length postavite maksimalan broj znakova koje korisnici mogu unijeti.

Vrijednost polja Auto scroll određuje hoće li se tekst pomicati prema gore i dolje kada je duži od širine polja.

Ako je odabran način zamjene ( Overwrite mode ), postojeći se tekst zamjenjuje novim, znak po znak. Inače se novi tekst umeće na položaj kursora, istiskujući postojeći tekst. Po zadanom, novi tekst ne zamjenjuje postojeći.

Kako biste spriječili korisnike da mijenjaju tekst, odaberite Read only.

Odaberite tekst

U polju Selection mode možete odrediti hoće li se pri odabiru teksta pokazivačem odabirati pojedinačni znakovi ili cijele riječi.

Odaberite Select by mouse kako biste korisnicima omogućili korištenje miša za odabir teksta na neki platformski specifičan način. Za neke platforme to možda neće biti prikladna interakcija jer bi moglo biti u sukobu s načinom na koji tekst treba funkcionirati unutar komponente Flickable, na primjer.

Za komponentu Text Edit možete odabrati Select by keyboard kako biste korisnicima omogućili upotrebu tipkovnice za odabir teksta čak i ako je polje za uređivanje samo za čitanje. Ako je ova svojina postavljena na false, korisnici ne mogu koristiti tipkovnicu za odabir teksta čak i ako je uređivo.

Fokus

Vrijednost svojstva Focus on press određuje hoće li polje za uređivanje teksta ili unos dobiti aktivni fokus prilikom pritiska miša.

Po zadanom pokazivač postaje vidljiv kada tekstualno polje za uređivanje ili unos dobije aktivni fokus, tako da se ostale svojstva mogu vezati uz to je li pokazivač trenutačno prikazan. Budući da se vrijednost svojstva Cursor visible automatski postavlja i poništava, bilo koja vrijednost koju sami postavite može biti nadpisana.

Ako je svojstvo Persistent selection odabrano, tekstualni unos ili polje za unos zadržava odabir kada aktivni fokus prijeđe na drugu komponentu.

kartice i margini

Možete navesti dodatna svojstva za formatiranje bloka teksta u komponenti Text Edit.

U polju za formatiranje tabova ( Tab stop distance ) postavite zadano razmak, u jedinicama uređaja, između zaustavnica tabulatora.

U polju za postavke poravnanja teksta ( Text margin ) postavite marginu oko teksta u piksima.

Punjenje

Vrijednosti svojstava u odjeljku Padding određuju razmak oko sadržaja. Pojedinačna svojstva razmaka nasljeđuju vrijednost iz polja Global, osim ako ih izričito ne postavite.

Tekst za popunjavanje

Za kontrole Text Field i Text Area možete odrediti tekst koji će se prikazivati u polju prije nego što korisnici unesu tekst. Odredite tekst u polju Placeholder text i njegovu boju u polju Placeholder color.

Odaberite Hover kako biste omogućili da polje teksta prihvaća događaje prelaska mišem.

Sažetak tekstualnih komponenti

Sljedeća tablica navodi komponente koje možete koristiti za dodavanje teksta u korisničke sučelje. Kolona Lokacija sadrži naziv kartice u kojoj možete pronaći komponentu u Components u. Kolona podrške za MCU označava koje su komponente podržane na MCU-ima.