Categories > Exploiting > Tutorials >

[TUTORIAL] How to create your own XAML Styles

RealRealNik

type !larry in chat ;)

vip

Posts: 431

Threads: 23

Joined: Nov, 2021

Reputation: 43

Posted

Remember this is just my own way of creating style

In this tutorial I will be creating a basic button with round corners and no hover over effect.

I am not a really good teacher so forgive me if I dont explain something properly.

 

Step 1.

Create a new folder in the solution explorer and create a Ressource Dictionary in the folder you just created.

https://media.discordapp.net/attachments/1067168861343989910/1108828129801289748/pDw4Xh3Tgk.png

 

Step 2.

Open the Ressource dictionary and create a new Style. Set the properties "x:Key"," "TargetType" and "x:Name" to your liking.

"TargetType" is the most important of those properties, set this property to the element you are creating the style for.

https://media.discordapp.net/attachments/1067168861343989910/1108829043085803580/vhEUte2rYq.png?width=1440&height=445

 

Step 3.

Create a Setter and set its "Property" property to "Template". Create Setter.Value and a ControlTemplate. Set the "TargetType" property again to the element you are creating the style for.

 https://media.discordapp.net/attachments/1067168861343989910/1108831076798971986/cJ7IgvAr4J.png?width=1440&height=529

 

Step 4.

Create a border in the ControlTemplate and modify its properties how you like. This border will decide how the element will look like. Remember to put in "<ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center"/>" so you can use stuff like text.

If you want to modify a propety like background between all the different elements without creating a new style for everything you can use "TemplateBinding". In this example I set the Background property to "{TemplateBinding Background}"

https://cdn.discordapp.com/attachments/1067168861343989910/1108836312628351056/jxPu1cAYPC.png

 

Step 5.

Navigate to "App.xaml" in your solution explorer. Create "ResourceDictionary" and in that create "ResourceDictionary.MergedDictionaries". Reference the style by typing <ResourceDictionary Source="PATH OF YOUR STYLE"/>   

https://cdn.discordapp.com/attachments/1067168861343989910/1108835183140024390/UrnGk6Rdct.png

 

Step 6.

Et voilà!

https://cdn.discordapp.com/attachments/1067168861343989910/1108836740363460719/JPibDK8hXY.png

 

 

I hope this helped you out a bit if you were struggling : ). Again I am sorry if I might not have explained everything properly.

 

  • 2

https://media.discordapp.net/attachments/1067168861343989910/1099371568062267503/WRDBanner_RealRealNikkk.png

 

Siggy made by B00M :D

Posts: 663

Threads: 65

Joined: Oct, 2022

Reputation: 30

Replied

Vouch. This will help new people to work.

  • 1

Try the cheat launcher verve today ⬇

https://i.imgur.com/QdS8sQ5.png

Join Neuron Discord Server - https://discord.gg/harAKHv32K

RiceUsesArchBtw

rice cracker

vip

Posts: 465

Threads: 19

Joined: Aug, 2021

Reputation: 39

Replied

x:Name isnt required

Comments

RealRealNik 43 Reputation

Commented

True, I will correct it later

  • 0

  • 0

https://cdn.discordapp.com/attachments/1023423265160560745/1132948683747500092/Frame_12x.png

Entity

Usability >> modern

vip

Posts: 416

Threads: 40

Joined: May, 2022

Reputation: 51

Replied

can't be more competition :OOOOOOOOOO :(((

Comments

RealRealNik 43 Reputation

Commented

hehe ;)  /charrss

  • 0

  • 0

KanekiCat

Kaneki Cat

vip

Posts: 102

Threads: 4

Joined: Oct, 2021

Reputation: 24

Replied

Vouch, this is really useful especially for beginners :D

  • 1

https://cdn.discordapp.com/attachments/1137630921638551623/1138441474980192266/programming.gif

Users viewing this thread:

( Members: 0, Guests: 1, Total: 1 )