Satura rādītājs
Izmantojot dažādās zīmēšanas metodes, kas redzamas sadaļā audekls Tajos ir iespējams noteikt apgabalus zīmēšanai, lai gan tas ir nedaudz sarežģītāk, bet tas ir pilnīgi iespējams, tomēr mums ir arī iespēja sasniegt tādu pašu rezultātu, izmantojot metodi clip ().Vēl viens aspekts, ko var iekļaut arī audekls ir teksta zīmējums, varbūt mēs domājam, ka, izmantojot CSS un citus elementus, mēs varam uzzīmēt tādu pašu vai labāku tekstu, lai arī audekls ļauj mums lietot vietējās animācijas HTML5.
Klipu metode
Kā jau minējām sākumā, šī metode vienkāršo ceļu uz kā mēs varam izveidot sadaļu audeklā, lai varētu ieviest citus zīmētus elementus, piemēram, jaunu zīmējumu vai aizpildīt to ar noteiktu krāsu.
Lai izmantotu šo rīku, mums jāizsauc šī metode klips (), šī metode palīdz izveidot reģionu izgriešana vai jaunu sadaļu, tālāk redzēsim, kā tas darbojas:
Piemērs Jūsu pārlūkprogramma neatbalsta šo elementu audekls Šajā kodā mēs vispirms uzzīmējam lielu taisnstūri dzeltenā krāsā, pēc tam tajā izveidojam jaunu reģionu, izmantojot clip () metode un šajā reģionā mēs izveidojam jaunu sarkanu taisnstūri.
Apskatīsim, kā tas izskatās mūsu pārlūkprogrammā:
Mēs varam arī uzzīmēt tekstu audeklā, tāpēc mums ir šādas metodes:
fillText (, x, y, width): Zīmē un aizpilda pirmajā parametrā norādīto tekstu pozīcijā (x, y). Arī viņa arguments platums tas nav obligāts, bet, kad tas ir deklarēts, tas nosaka teksta platuma ierobežojumu.
strokeText (, x, y, width): Zīmē un atstāj tekstu bez polsterējuma pozīcijā (x, y). Tāpat kā iepriekšējā metode neobligātajā argumentā, tā ierobežo teksta platumu.
Apskatīsim šādu piemēru, kā izmantot šīs metodes, lai zīmētu tekstu uz mūsu audekla:
Piemērs Jūsu pārlūkprogramma neatbalsta šo elementu audekls Šajā kodā mēs izmantojam abas metodes, lai zīmētu vienu un to pašu tekstu gan vienā pozīcijā, gan citā krāsā, ar kuru mēs panākam vienas krāsas ārējā rāmja un citas krāsas aizpildījuma efektu, ar to mēs varam izveidot vairāk izteikta atšķirība starp fillText Y insultsTeksts.
Visbeidzot un lai pabeigtu šo apmācību, apskatīsim, kā tas izskatās pārlūkprogrammā.
