Transformacejsou skvely zpusob jak zmenit vzhled ovladacich prvku ve WPF tam, kde uz styly a sablony vetsinou nestaci. Zdrojovy kod je z knihy, ktera v cestine vysla pod nazvem “Mistrovstvi ve WPF” ( http://knihy.cpress.cz/mistrovstvi-ve-windows-presentation-foundation.html ), v anglictine pod nazvem Applications = Code + Markup (A Guide to the Microsoft Windows Presentation Foundation) od Charlese Petzolda ( http://charlespetzold.com/wpf/ ). Tento zdrojovy kod vypada takto a jsou v nem vsechny zakladni tranformace:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 |
<Page x:Class="K1456.Capitol29.TransformedButtons" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="300" Title="TransformedButtons"> <Canvas> <!--Tlacitko std. vzhledu bez jakekoliv transformace--> <Button Canvas.Left="50" Canvas.Top="100"> Untransformed </Button> <Button Canvas.Left="200" Canvas.Top="100"> Translated <Button.RenderTransform> <!--Posune tlacitko 100px dolevo a 150px dolu--> <TranslateTransform X="-100" Y="150"></TranslateTransform> </Button.RenderTransform> </Button> <Button Canvas.Left="350" Canvas.Top="100"> Scaled <Button.RenderTransform> <!--Zvetsi tlacitko 1.5x do sirky a 4x do vysky pri zachovani relativni velikosti textu--> <ScaleTransform ScaleX="1.5" ScaleY="4"></ScaleTransform> </Button.RenderTransform> </Button> <Button Canvas.Left="500" Canvas.Top="100"> Skewed <Button.RenderTransform> <!--Otoci tlacitko v uhlo 20° po smeru hodinovych rucicek - neni urceno pro otaceni v celem rozsahu stupnu--> <!--Asi to neni delane pro vyssi hodnoty, bo pri vyssich hodnotach se to chova nejak podivne(uplne roztazeni atd.). Asi to bude proto ze Skew znamena prekroutit--> <!--Muze nabyvat hodnot od 0 do 180(stejna jako 0) a -1 az -180(stejna jako 0)--> <!--Samozrejme jde zaroven zadat i parametr AngleX pro otoceni po vodorovne ose--> <SkewTransform AngleY="20"></SkewTransform> </Button.RenderTransform> </Button> <Button Canvas.Left="650" Canvas.Top="100"> Rotated <Button.RenderTransform> <!--Otaci tlacitko kolem jeho bodu 0,0, ktery se nemeni pri zadnem natoceni.--> <!--Pripustni hodnoty jsou -360-0(proti smeru hod. rucicek) a 0-360(po smeru hod. rucicek)--> <RotateTransform Angle="-30"></RotateTransform> </Button.RenderTransform> </Button> </Canvas> </Page> |
V tomtu kodu vidite, ze zakladni tranformace jsou:
- TranslateTransform – Posune element vodorovne i svisle podle hodnot v X, Y.
- ScaleTransform – Opticky zvetsi ci zmensi element.
- SkewTransform – Udela z tlacitka jiny tvar nez jeho vychozi.
- RotateTransform – Otaci tlacitko kolem jeho bodu 0,0.
Cely program po spusteni vyse vypada takto: