1

我想用 Metro 风格制作 Window。


我找到了以下 3 个库:

http://elysium.asvishnyakov.com/en/

https://github.com/MahApps/MahApps.Metro

http://mui.codeplex.com/

所有这些都适用于 Net Framework 4+。
3.5有什么吗?

我也尝试自己制作(没有完成 - 仍然需要设计它并添加 Resize [我不知道如何])但我真的不喜欢它的制作方式......:

<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit" x:Class="Windows_Hider.MainWindow"
        Title="Windows Hider" Height="350" Width="525" WindowStartupLocation="CenterScreen" 
        AllowsTransparency="True"
    ResizeMode="CanResize" WindowStyle="None" BorderBrush="Black" BorderThickness="1" Icon="windowshider.ico">
    <Grid>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <StackPanel Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Top">
                <Image Width="24" Height="24" Source="{Binding Icon, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}"/>
                <Label VerticalAlignment="Center" FontSize="14" Content="{Binding Title, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}"/>
            </StackPanel>
            <Grid MouseDown="Grid_MouseDown" Background="Transparent"/>
            <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Top" Grid.Row="0">
                <Button ToolTip="minimize" Background="White">
                    <Grid Width="30" Height="25">
                        <TextBlock Text="0" FontFamily="Marlett" FontSize="14" VerticalAlignment="Center" HorizontalAlignment="Center" Padding="3.5,0,0,3" />
                    </Grid>
                </Button>
                <Grid Margin="1,0,1,0">
                    <Button x:Name="Restore"  ToolTip="restore" Visibility="Collapsed">
                        <Grid Width="30" Height="25" UseLayoutRounding="True">
                            <TextBlock Text="2" FontFamily="Marlett" FontSize="14" VerticalAlignment="Center" HorizontalAlignment="Center" Padding="2,0,0,1" />
                        </Grid>
                    </Button>
                    <Button x:Name="Maximize" ToolTip="maximize">
                        <Grid Width="31" Height="25">
                            <TextBlock Text="1" FontFamily="Marlett" FontSize="14" VerticalAlignment="Center" HorizontalAlignment="Center" Padding="2,0,0,1" />
                        </Grid>
                    </Button>
                </Grid>
                <Button  x:Name="Close" ToolTip="close">
                    <Grid Width="30" Height="25">
                        <TextBlock Text="r" FontFamily="Marlett" FontSize="14" VerticalAlignment="Center" HorizontalAlignment="Center" Padding="0,0,0,1" />
                    </Grid>
                </Button>
            </StackPanel>
        </Grid>
    </Grid>
</Window>
4

2 回答 2

2

好的,我花了几天的时间,但最后我设法做了一些事情。

我必须自己制作,因为没有适用于 Net Framework 3.5 的 Metro Window。

我结合了以下一些参考资料:

在自定义窗口上启动窗口的系统菜单

http://www.codeproject.com/Articles/107994/Taskbar-with-Window-Maximized-and-WindowState-to-N

http://blog.magnusmontin.net/2013/03/16/how-to-create-a-custom-window-in-wpf/

http://codekong.wordpress.com/2010/11/10/custom-window-style-and-accounting-for-the-taskbar/

http://blog.creativeitp.com/posts-and-articles/c-sharp/simple-methods-to-drag-and-resize-your-c-tr​​ansparent-wpf-application-with-the-windowstyle-property-设为无/



这是最终的解决方案

已知问题/错误:
1. 调整大小时出现箭头光标而不是调整大小光标。
2. Designer 无法显示自定义窗口。
3. 最大化时,屏幕大面积随机出现蓝色(边框的颜色) - 瞬间

如果您可以解决上述任何问题,那就更好了,但我对我所取得的成就感到满意。

编辑:
更新以允许调整大小模式(还添加了示例)

于 2013-10-19T10:12:00.080 回答
1

自己做这件事相对容易......您需要做的就是复制Style您在 UI 中看到的Metro内容,正如您所说的那样。首先,这是一个非常简单的方法Style,可以更改元素的默认外观ControlTemplateButton

<Style TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Grid>
                    <ContentPresenter HorizontalAlignment="Center" 
                        VerticalAlignment="Center" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

当然,当用户将鼠标指针移到 上时,您会希望发生一些事情Button,您可以通过VisualStateManager.VisualStateGroupsControlTemplate. 您可以在 MSDN 上的ControlTemplate 类页面中找到完整的示例。

其他控件Metro风格的控件可以通过ControlTemplate同样的方式创建简单的s来轻松开发。基本上,您只需要删除默认的 WPF 外观,并且在大多数情况下,只需将其替换ContentPresenter为上面示例中的 a 或ItemsPresenterfor 集合控件。幸运的是,Metro外观非常简单明了,只要记住让所有东西都间隔开和简单。

为了解决您对调整大小感到疯狂的另一点;您可以将Window.ResizeMode属性设置CanResizeWithGrip为在右下角添加调整大小的夹点,这Window在这些应用程序中很常见。

于 2013-10-12T17:40:36.377 回答