這里我們帶來(lái)的是另一種表單Checkbox元素的實(shí)現(xiàn)方式。
這里是效果圖：
我們需要一張選擇按鈕的圖片20x20像素透明PNG格式铺峭，然后墓怀，可以為True和False狀態(tài)設(shè)置回調(diào)函數(shù)動(dòng)作。
同時(shí)卫键，如果把他添加到一個(gè)狀態(tài)組StateGroup的話(huà)傀履，上面這種實(shí)現(xiàn)方式也可以很容易地轉(zhuǎn)換為單選按鈕radio的形式。
主體代碼如下：
<pre>
<ToggleControl ux:Class="CheckboxToggle" Margin="2" Width="26" Height="26" ux:Name="_switch" Value="false" IsEnabled="true">
<Clicked>
<Toggle Target="_switch" />
</Clicked>
<Panel Layer="Background">
<Rectangle Alignment="Center">
<Rectangle Width="26" Height="26" Layer="Background" Alignment="Center" ux:Name="_toggleStateIndicator">
<SolidColor Color="#FFF0" ux:Name="_toggleModeIndicatorColor" />
<Stroke Width="1">
<SolidColor Color="#FFF" />
</Stroke>
</Rectangle>
<Image File="Assets/b.png" ux:Name="_toggleStateImage" Width="20" Height="20" />
</Rectangle>
</Panel>
<WhileTrue>
<Scale Factor="1.1" Duration="0.1" DurationBack="0.1" />
<Change _toggleStateImage.Color="#00A196" Duration="0.1" DurationBack="0.1" />
<Change _toggleModeIndicatorColor.Color="#BEFAEE" Duration="0.1" DurationBack="0.5" />
<Scale Target="_toggleStateIndicator" Factor="1.2" Duration="0.5" DurationBack="0.2" Easing="ElasticOut" EasingBack="CubicIn" />
<Callback Handler="{yourToggleOnFunction}" />
</WhileTrue>
<WhileFalse>
<Callback Handler="{yourToggleOffFunction}" />
</WhileFalse>
</ToggleControl>
<StackPanel>
<CheckboxToggle />
<CheckboxToggle />
</StackPanel>
</pre>
Tag：Fuse表單組件
發(fā)布時(shí)間：2016年05月24日
博客被黑莉炉，挪窩簡(jiǎn)書(shū)安家……
