WPF“六角网格” 成分

Question

进入 WPF 自定义控件的世界，想知道设计 HexGrid 控件的最佳方法是什么？ 想想你最喜欢的桌面战争游戏； 或者，同样可能的是，您最喜欢的视频游戏借鉴了令人自豪的桌面战争游戏历史的设计。

底层模型公开了一个重要的方法，作为 Map 类的一部分：

Hex GetHex(int x, int y, int z)*;

Hex 包含所有相关数据（目前，Terrain 枚举将 1:1 映射到背景颜色；从小处开始...）。

可能相关的限制：
地图大小和尺寸不变 十六进制数据会在非常可预测的时间发生变化（始终直接响应用户操作）。

理想情况下，该组件将扩展以干净地填充其容器，并且可以直接在 XAML 中声明。

我正在寻找的是构建此组件所需的粗略轮廓，而不是现成的组件。

*虽然我对这个寻址方案非常聪明，但显然我迟到了。

Answer 1

我认为在 WPF 中，将 HexGrid 设计为 Panel 而不是 UserControl 更为合理。 面板没有视觉表示，只需正确排列子元素（在 HexGrid 的情况下 - 采用蜂窝图案）。 这些子元素依次应该具有六边形形状。

概念证明：我的 HexGrid 项目（太大，无法在此处发布）

CodeProject 文章

< a href="https://github.com/AlexanderSharykin/HexGrid" rel="noreferrer">GitHub 存储库

HexList：选择器 ItemsControl，在 HexGrid 面板上显示 HexItem 容器中的项目

< strong>HexGrid：以蜂窝状图案排列子元素的面板

HexItem：六角形 ContentControl

声明性用法示例：

<hx:HexList Name="HexColors" Orientation="Vertical"
            Grid.Row="1"
            Padding="10"
            SelectedIndex="0"
            Background="{Binding Path=SelectedItem.Background, RelativeSource={RelativeSource Self}}"
            RowCount="5" ColumnCount="5">
    <hx:HexItem Grid.Row="0" Grid.Column="1" Background="#006699"/>
    <hx:HexItem Grid.Row="0" Grid.Column="2" Background="#0033CC"/>
    <hx:HexItem Grid.Row="0" Grid.Column="3" Background="#3333FF"/>
    <!--...-->
    <hx:HexItem Grid.Row="4" Grid.Column="1" Background="#CC9900"/>
    <hx:HexItem Grid.Row="4" Grid.Column="2" Background="#FF3300"/>
    <hx:HexItem Grid.Row="4" Grid.Column="3" Background="#CC0000"/>
</hx:HexList>

我明白问题是老歌，但分享我的解决方案以防万一

Answer 2

编辑：这是皮特项目页面的链接，其中有一个六角网格示例。
http://blois.us/Projects.html
有一个寻路示例，显示了一个名为寻路的项目，它有一个六角网格，并且可能使用与扫雷相同的基本代码。 我还没看过。 它是 Silverlight 3，因此可能需要升级。 扫雷非常优雅。

拉尔夫

原文：
Peter blois 提供了 silverlight 2 的六角版扫雷样本。

它包括源代码。 他有一个非常优雅的方法，通过覆盖网格上的measureoverride和arrangeoverride来做到这一点。 鼠标悬停等效果很好。 代码非常少。

我在网上找不到这个项目了，尽管谷歌通过搜索六边形扫雷银光源代码有一个过时的链接，布洛伊斯彼得

布洛伊斯在以下地址有一个最新的博客，所以你可以尝试在这里联系他。 。
http://blois.us/Projects.html

祝你好运，告诉我进展如何，我'我会做类似的事情。