微软用于其Windows 7手机的unit converter starter kit生成键盘,下面再现了XAML。显然是大量的复制和粘贴。
问题:
1)MSFT是否认真写这种方式?
2)真的?????
3)是否有一种理智的方式来写这样的东西?
4)有没有人知道代码示例说明了这种理智的方式?
<StackPanel Orientation="Vertical">
<TextBlock x:Name="textBlockCategory"
Text="{Binding Path=UppercasedCategory}"
Margin="23,24,0,0"
FontSize="{StaticResource PhoneFontSizeMedium}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Foreground="{StaticResource PhoneForegroundBrush}" />
<StackPanel x:Name="spInput"
Orientation="Vertical"
Margin="0,0,24,0" >
<TextBlock x:Name="textBlockInputValue"
Text="{Binding Path=UpperUnitValue}"
Height="80" Margin="0,2,0,0"
TextAlignment="Right"
FontSize="{StaticResource PhoneFontSizeExtraExtraLarge}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Foreground="{StaticResource PhoneForegroundBrush}" />
<TextBlock x:Name="textBlockInputUnit"
Text="{Binding Path=UpperUnitName}"
Height="34" TextAlignment="Right" Margin="0,2,0,0"
FontSize="{StaticResource PhoneFontSizeMediumLarge}"
Foreground="{StaticResource PhoneAccentBrush}"
FontFamily="{StaticResource PhoneFontFamilySemiBold}" />
</StackPanel>
<StackPanel x:Name="spResult"
Orientation="Vertical"
Margin="0,-4,24,0" >
<TextBlock x:Name="textBlockResultValue"
Text="{Binding Path=LowerUnitValue}"
Height="80" TextAlignment="Right" Margin="0,-4,0,0"
FontSize="{StaticResource PhoneFontSizeExtraExtraLarge}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Foreground="{StaticResource PhoneSubtleBrush}"/>
<TextBlock x:Name="textBlockResultUnit"
Text="{Binding Path=LowerUnitName}"
Height="34" TextAlignment="Right" Margin="0,2,0,0"
FontSize="{StaticResource PhoneFontSizeMediumLarge}"
Foreground="{StaticResource PhoneAccentBrush}"
FontFamily="{StaticResource PhoneFontFamilySemiBold}" />
</StackPanel>
<StackPanel x:Name="spSummary" >
<TextBlock x:Name="textBlockSummary"
Text="{Binding Path=Summary}"
Height="30" TextAlignment="Center" Margin="0,18,0,0"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneSubtleBrush}"
FontFamily="{StaticResource PhoneFontFamilyNormal}" />
</StackPanel>
<StackPanel x:Name="spKeypad" Orientation="Vertical" HorizontalAlignment="Right">
<StackPanel x:Name="spKeypadRow1" Orientation="Horizontal">
<Button x:Name="btnKeypadKey7"
Content="7"
Background="{StaticResource PhoneInactiveBrush}"
Foreground="{StaticResource PhoneForegroundBrush}"
Height="84" Margin="6" Width="108"
Style="{StaticResource KeypadButtonStyle}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource KeypadButtonFontSize}"
Click="OnClickNumber" />
<Button x:Name="btnKeypadKey8"
Content="8"
Background="{StaticResource PhoneInactiveBrush}"
Foreground="{StaticResource PhoneForegroundBrush}"
Height="84" Margin="6" Width="108"
Style="{StaticResource KeypadButtonStyle}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource KeypadButtonFontSize}"
Click="OnClickNumber" />
<Button x:Name="btnKeypadKey9"
Content="9"
Background="{StaticResource PhoneInactiveBrush}"
Foreground="{StaticResource PhoneForegroundBrush}"
Height="84" Margin="6" Width="108"
Style="{StaticResource KeypadButtonStyle}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource KeypadButtonFontSize}"
Click="OnClickNumber" />
<Button x:Name="btnKeypadKeyCancel"
Height="84" Margin="6" Width="108"
Style="{StaticResource btnKeypadKeyCancelStyle}"
Background="{StaticResource PhoneDisabledBrush}"
FontSize="{StaticResource PhoneFontSizeExtraLarge}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Click="OnClickClear" />
</StackPanel>
<StackPanel x:Name="spKeypadRow2" Orientation="Horizontal">
<Button x:Name="btnKeypadKey4"
Content="4"
Background="{StaticResource PhoneInactiveBrush}"
Foreground="{StaticResource PhoneForegroundBrush}"
Height="84" Margin="6" Width="108"
Style="{StaticResource KeypadButtonStyle}"
FontSize="{StaticResource KeypadButtonFontSize}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Click="OnClickNumber" />
<Button x:Name="btnKeypadKey5"
Content="5"
Background="{StaticResource PhoneInactiveBrush}"
Foreground="{StaticResource PhoneForegroundBrush}"
Height="84" Margin="6" Width="108"
Style="{StaticResource KeypadButtonStyle}"
FontSize="{StaticResource KeypadButtonFontSize}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Click="OnClickNumber" />
<Button x:Name="btnKeypadKey6"
Content="6"
Background="{StaticResource PhoneInactiveBrush}"
Foreground="{StaticResource PhoneForegroundBrush}"
Height="84" Margin="6" Width="108"
Style="{StaticResource KeypadButtonStyle}"
FontSize="{StaticResource KeypadButtonFontSize}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Click="OnClickNumber" />
<Button x:Name="btnKeypadKeyBack"
Height="84" Margin="6" Width="108"
Style="{StaticResource btnKeypadKeyBackStyle}"
Background="{StaticResource PhoneDisabledBrush}"
FontSize="{StaticResource PhoneFontSizeExtraLarge}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Click="OnClickBack" />
</StackPanel>
<StackPanel x:Name="spKeypadRow3" Orientation="Horizontal">
<Button x:Name="btnKeypadKey1"
Background="{StaticResource PhoneInactiveBrush}"
Foreground="{StaticResource PhoneForegroundBrush}"
Height="84" Margin="6" Width="108"
Content="1"
Style="{StaticResource KeypadButtonStyle}"
FontSize="{StaticResource KeypadButtonFontSize}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Click="OnClickNumber" />
<Button x:Name="btnKeypadKey2"
Content="2"
Background="{StaticResource PhoneInactiveBrush}"
Foreground="{StaticResource PhoneForegroundBrush}"
Height="84" Margin="6" Width="108"
Style="{StaticResource KeypadButtonStyle}"
FontSize="{StaticResource KeypadButtonFontSize}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Click="OnClickNumber" />
<Button x:Name="btnKeypadKey3"
Content="3"
Background="{StaticResource PhoneInactiveBrush}"
Foreground="{StaticResource PhoneForegroundBrush}"
Height="84" Margin="6" Width="108"
Style="{StaticResource KeypadButtonStyle}"
FontSize="{StaticResource KeypadButtonFontSize}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Click="OnClickNumber" />
<Button x:Name="btnKeypadKeyPlusMinus"
Height="84" Margin="6" Width="108"
Style="{StaticResource btnKeypadPlusMinusStyle}"
Background="{StaticResource PhoneDisabledBrush}"
FontSize="{StaticResource PhoneFontSizeExtraLarge}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Click="OnClickSign" />
</StackPanel>
<StackPanel x:Name="spKeypadRow4" Orientation="Horizontal">
<Button x:Name="btnKeypadKey0"
Content="0"
Background="{StaticResource PhoneInactiveBrush}"
Foreground="{StaticResource PhoneForegroundBrush}"
Height="84" Margin="6" Width="228"
Style="{StaticResource KeypadButtonStyle}"
FontSize="{StaticResource KeypadButtonFontSize}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Click="OnClickNumber" />
<Button x:Name="btnKeypadKeyPoint"
Content="{Binding Path=CurrentCulture.NumberFormat.NumberDecimalSeparator, Source={StaticResource Resources}}"
Background="{StaticResource PhoneInactiveBrush}"
Foreground="{StaticResource PhoneForegroundBrush}"
Height="84" Margin="6" Width="108"
Style="{StaticResource btnKeypadPointStyle}"
FontSize="{StaticResource KeypadButtonFontSize}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Click="OnClickNumber" />
<Button x:Name="btnKeypadSwitchSourceTargetUnit"
Height="84" Margin="6" Width="108"
Style="{StaticResource KeypadButtonStyle}"
Background="{StaticResource PhoneDisabledBrush}"
FontSize="{StaticResource PhoneFontSizeExtraLarge}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
Click="OnClickSourceTargetUnit">
<Image Source= "{Binding ConversionImageSource}"/>
</Button>
</StackPanel>
</StackPanel>
</StackPanel>
答案 0 :(得分:1)
如果您要模仿相同类型的设计,我肯定会使用样式来减少所有这些按钮的重复。看起来他们已经通过创建KeypadButtonStyle开始了这条道路,但是你还可以构建更多,特别是如果你使用基于其他样式的样式。
您还可以使用网格而不是堆栈面板来完成布局。
在使用代码和循环构建这个xaml方面你可以做到,但我强烈建议学习Expression Blend,它不会花费你很长时间来创建你需要的xaml(包括样式优化)。
答案 1 :(得分:1)
XAML是一种非常强大的语言,但正如你所正确指出的那样,它本身就是冗长而丑陋的。这是我在DRY(不要重复自己)时所见过的最糟糕的语言。也就是说,其他人所做的所有评论也是如此。样式有很多帮助。 Blend有助于实现更多目标。
我的第一印象和你的一样,虽然我已经意识到它确实是一种非常强大和有用的语言,但我从未停止过认为它的部分设计确实很差。这是一个例子;您无法指定要数据绑定的对象的数据类型的事实是另一个。
所有这一切,学习XAML确实值得。你可以使用XAML做的事情,这在HTML或WinForms或Java中是不可能的。它是一种非常非常强大的UI描述语言。只要把它当成它,用力吞咽,忘记你所学到的关于良好编码风格的一切,你就能创造出一些令人惊叹的用户界面。
答案 2 :(得分:0)
不,如果您不想,则无需复制和粘贴XAML代码。 XAML只是一个创建对象和设置属性的对象图。您在XAML中编写的任何代码也可以在程序上编写(如果您愿意,可以在for循环中编写)。
答案 3 :(得分:0)
XAML中一个非常强大的元素是ItemsControl。有了它,您可以通过简单地使您的UI数据驱动和灵活来避免许多重复标记结构。在运行时,您可以分配数据源,然后ItemsControl将动态扩展模板,以根据所分配的数据构建UI。
http://msdn.microsoft.com/en-us/library/system.windows.controls.itemscontrol(VS.95).aspx