Uzziniet, kā integrēt šo veidņu programmu savās pavasara lietojumprogrammās.
Thymeleaf ir Java veidņu dzinējs. Tā izstrādā veidnes gan tīmekļa, gan atsevišķām lietojumprogrammām. Šī veidņu programma izmanto dabisko veidņu koncepciju, lai jūsu izkārtojumā ievadītu loģiku, neapdraudot jūsu dizainu. Izmantojot Thymeleaf, jūs varēsit kontrolēt, kā lietojumprogramma apstrādās jūsu izveidotās veidnes.
Varat izmantot Thymeleaf, lai apstrādātu sešu veidu veidnes: HTML, XML, tekstu, JavaScript, CSS un RAW. Thymeleaf atsaucas uz katru no veidnēm kā veidņu režīmu, un HTML ir vispopulārākā šajā programmā izveidotā veidne.
Timiāna lapas inicializācija jūsu lietojumprogrammā
Ir divi veidi, kā pievienot Thymeleaf savai Spring Boot lietojumprogrammai. Varat atlasīt Thymeleaf kā atkarību, ģenerējot katlu ar Pavasara inicializācijas rīks. Varat arī to vēlāk pievienot savam būvējuma specifikācijas failam atkarību sadaļā.
Ja atlasījāt kādu no Gradle projekta opcijām, fails, kurā ir ietvertas atkarības, ir celt.gradle failu. Tomēr, ja izvēlējāties Maven, tad šis fails ir pom.xml.
Jūsu pom.xml failā jābūt šādai atkarības sadaļai:
<dependency><groupId>org.springframework.bootgroupId>
<artifactId>spring-boot-starter-thymeleafartifactId>
dependency>
Kamēr jūsu celt.gradle failā jābūt šādai atkarības sadaļai:
dependencies {implementation 'org.springframework.boot: spring-boot-starter-thymeleaf'
}
Rakstā izmantotais lietojumprogrammas paraugs ir pieejams šajā GitHub repozitorijs un to varat izmantot bez maksas saskaņā ar MIT licenci.
Pievienojot Thymeleaf savai Spring lietojumprogrammai, jūs iegūsit piekļuvi tās galvenajai bibliotēkai, kas ļauj izmantot Thymeleaf pavasara standarta dialektu. Pavasara standarta dialekts satur unikālus atribūtus un sintakse, ko varat izmantot, lai saviem izkārtojumiem pievienotu dažādas funkcijas.
Thymeleaf izmantošana Spring Boot
Izmantojot Thymeleaf savā Spring lietojumprogrammā, pirmais solis ir izveidot veidnes dokumentu. Šim lietojumprogrammas paraugam veidnes dokuments ir HTML. Savas Thymeleaf veidnes vienmēr jāizveido pakalpojumā Spring Boot’s veidnes mapi, kas ir pieejama resursu failā.
Fails home.html
html><htmlxmlns: th="http://www.thymeleaf.org">
<head>
<title>Generic Websitetitle>
head>
<body>body>
html>
Iepriekš minētā Thymeleaf veidne ir vispārīga HTML5 veidne ar vienu svešu atribūtu (xmlns: th). Mērķis xmlns: th atribūts ir nodrošināt darbības jomu visiem th:* atribūti, ko izmantosit šajā HTML dokumentā. Pārējie atribūti un atzīmes Thymeleaf veidnē ir tradicionāli HTML tagi un atribūti.
Galvenes izveide
Viens no pirmajiem un svarīgākajiem jebkuras vietnes vai lietojumprogrammas aspektiem ir galvene. Tas parāda, par ko ir lietojumprogramma (izmantojot logotipu), un palīdz ērti orientēties lietojumprogrammā. Pamata galvenē ir jābūt logotipam, kā arī vairākām navigācijas saitēm.
html><htmlxmlns: th="http://www.thymeleaf.org">
<body>
<divid="nav">
<h1>LOGOh1>
<ul>
<li><aid="current">Home a>li>
<li><a>Abouta>li>
<li><a>Servicesa>li>
ul>
div>
body>
html>
Thymeleaf ļauj pievienot augšējo galveni jebkurai tīmekļa lietojumprogrammas lapai, izmantojot th: ievietot atribūts. The th: ievietot un th: aizstāt atribūti pieņem to, ko Thymeleaf sauc par fragmentu izteiksmes vērtībām. Fragmentu izteiksmes ļauj izvietot marķējuma fragmentus jebkurā izkārtojuma vietā.
<divth: insert="~{header:: #nav}">div>Marķējuma ievietošana augšpusē augšpusē mājaslapa.html tags ievietos galvenes marķējumu jūsu sākumlapas augšdaļā. Fragmenta izteiksmei ir vairāki komponenti, divi nav obligāti un divi ir nepieciešami:
- Tilde (~), kas nav obligāta.
- Cirtainu breketu pāris ({}), kas nav obligāti.
- Tās veidnes nosaukums, kurā ir marķējums, kuru vēlaties ievietot (header.html).
- Ievietojamā marķējuma CSS atlasītājs (#nav).
Tātad, sekojošais marķējums rada tādu pašu rezultātu kā iepriekšējais.
"header:: #nav">Veidnes pamatteksta aizpildīšana
Thymeleaf ļauj veidnēs izmantot piecu veidu izteiksmes:
- Fragmenta izteiksme (~{…})
- Ziņojuma izteiksme (#{…})
- Saites URL izteiksme (@{…})
- Mainīgā izteiksme (${…})
- Atlases mainīgā izteiksme (*{…})
Ziņojuma izteiksme ļauj izkārtojumam pievienot ārējos teksta fragmentus. Izmantojot ziņojumu izteiksmes, varat viegli aizstāt vai atkārtoti izmantot tekstu savā izkārtojumā. Lietojot ziņojuma izteiksmi, ārējie teksta fragmenti vienmēr jāievieto a .īpašības failu zem resursus mapi.
Šim lietojumprogrammas paraugam šis fails ir ziņas.īpašības, kurā ir šāds teksta fragments:
placeholder.text=Lorem ipsum, dolor sit amet consectetur adipisicing elit. Dolorem porro non quae obcaecati illo laboriosam.Jāņem vērā, ka teksta fragmentam (vai ziņojumam) ir unikāla atslēga (vietturis.teksts). Tas ir tāpēc, ka katrā ziņojuma failā var būt dažādu ziņojumu kolekcija. Tātad, jums būs nepieciešama atslēga, lai izkārtojumā ievietotu konkrētu ziņojumu.
<pth: text="#{placeholder.text}">p>Ievietojot iepriekš minēto marķējumu HTML faila pamattekstā, viettura teksts jūsu skatā tiks parādīts kā rindkopa. Atšķirībā no fragmentu izteiksmes, katrs ziņojuma izteiksmes aspekts ir obligāts. Ziņojuma izteiksmei ir nepieciešams:
- Skaitļa zīme (#).
- Cirtainu breketu pāris ({}).
- Atslēga, kurā atrodas ziņojums, kuru vēlaties ievietot (vietturis.teksts).
Veidnes veidošana
Vēl viens svarīgs fails resursus mape ir statiskais fails. Šajā failā tiek saglabāti jūsu CSS faili un visi attēli, ko plānojat izmantot savā lietojumprogrammā. Lai saistītu savu ārējo CSS failu ar Thymeleaf HTML veidni, jums būs jāizmanto saites URL izteiksme. Saites URL izteiksmes procesi gan relatīvos, gan absolūtos URL.
<linkrel="stylesheet"th: href="@{/css/style.css}" />Iepriekš redzamā marķējuma ievietošana HTML failā ļaus jums izveidot veidnes stilu, izmantojot a stils.css failu. Šis fails ir pieejams a css mapi zem statisks sadaļā resursus pieteikuma parauga fails. Jums vienmēr ir jāpiešķir saites URL izteiksme th: href atribūts.
Thymeleaf nodrošina vairākus citus atribūtus, kurus varat izmantot, lai uzlabotu izkārtojuma dizainu. Viens no šādiem atribūtiem ir th: stils atribūts, ko varat izmantot, lai izkārtojumam pievienotu attēlus.
<divid="showcase"th: style="'background: url(/images/background.jpg) no-repeat center center fixed;'">Iepriekš norādītajā marķējumā tiek izmantots th: stils atribūtu, lai pievienotu fona attēlu noteiktai izkārtojuma sadaļai. Thymeleaf ir vairāk nekā simts dažādu atribūtu, ko varat izmantot, lai piešķirtu izkārtojumam stilu un funkcionalitāti.
Mainīgā izteiksme
Mainīgie izteicieni ir vispopulārākie un, iespējams, vissarežģītākie izteicieni, ko izmanto Thymeleaf. Thymeleaf mainīgo izteiksmes ļauj apkopot datus no lietojumprogrammas konteksta vai objekta lietojumprogrammā un ievadīt šos datus veidnē. Atkarībā no datu avota, ko vēlaties renderēt savā skatā, varat izmantot divu veidu mainīgās izteiksmes.
Primārā mainīgā izteiksme izmanto dolāra zīmi un ļauj apkopot datus no lietojumprogrammas konteksts (kas ir dati, kas saistīti ar dažādiem uzdevumiem, kas darbojas pieteikums). Piemēram, ja vēlaties tvert lietotāja datus no modāla, dolāra zīmes mainīgā izteiksme ir praktiskāka izvēle. Ja izpildāt paraugprojektu un pārejat uz http://localhost: 8080/ savā pārlūkprogrammā redzēsit šādu modālu:
Pēc modāla aizvēršanas vai nosaukuma iesniegšanas lietojumprogramma pāries uz sākumlapu. Sākumlapā redzēsit vispārīgu vietni, kurā ir redzams vārds “Laipni lūdzam”, kam seko virkne, ko tikko iesniedzāt modālā.
Lietojumprogrammas paraugs izmanto mainīgo izteiksmi, lai pabeigtu šo procesu. Vienkāršā forma modal.html failam ir šāds marķējums:
<formid="form"th: action="@{/home}"method="post"><inputtype="text"name="userName"class="form-control"placeholder="Your Name" />
<buttontype="submit"class="btn">Submitbutton>
form>
Kad lietotājs iesniedz veidlapu, tas aktivizē th: darbība atribūts, kam ir ziņas URL vērtība, ko varat atrast šeit WebController klasē.
@PostMapping("/home")public String processName(String userName, Model model){
model.addAttribute("userName", userName);
return"home";
}
The procesa nosaukums() metode pieņem virkni, ko lietotājs piegādā modālam, pēc tam piešķir šo virkni mainīgajam, ko sauc lietotājvārds. Izmantojot mainīgā izteiksmi, kontrolleris pēc tam ievada lietotājvārda mainīgo izkārtojumā.
<h1>Welcome <spanth: text="${userName}">span>!h1>Atlases mainīgā izteiksmē tiek izmantota zvaigznīte, un tā ir visnoderīgākā, ja jums ir darīšana ar sarežģītākām lietojumprogrammām. Piemēram, lietojumprogramma, kurā lietotājiem ir jāpierakstās, var izmantot atlases mainīgā izteiksmi. Jūs varat savākt lietotājvārdu no lietotāja objekta un ievietot to izkārtojumā.
Alternatīvas veidņu un stila opcijas
Lai gan Thymeleaf ir populārākā Spring Boot lietojumprogrammu veidņu opcija, ir vairākas citas tikpat dzīvotspējīgas iespējas. Tie ietver JavaServer Pages (JSP), Groovy bāzes veidnes, FreeMarker veidnes un Moustache veidnes. Papildus pielāgota CSS stila izveidei varat arī izvēlēties izmantot CSS ietvaru, lai veidotu izkārtojuma stilu.
