Question

我想要做的事情在SL / WP 8中非常容易，但在WP 8.1中似乎是不可能的，而不是自己重新定义Hub模板。我想创建一个带有标题的集线器：

横向滚动。
背景随之滚动。
两边都没有边距。

我知道这可以通过让我的背景图像包含背景和集线器透明来解决，但我想知道是否有办法在XAML中解决它。

将带有背景的Grid放入Hub的标题只会突出显示背景，而不是集线器需要 - 而不是一直延伸：

<Hub>
    <Hub.Header>
        <Grid Background="Red" Height="60">
            <TextBlock Text="My Header" />
        </Grid>
    </Hub.Header>
</Hub>

上面的标题带有“My Header”文本，但只有文本部分有背景。此外，Hub本身似乎每边都有16个内边距，因此背景不会延伸到整个手机屏幕。

我应该选择背景还是解构模板以删除边距？

Answer 1

远非一个优雅的解决方案，但基本上我把背景放在Hub之外并给它带来负边距。 Hacky，但我想它确实有用。

<Grid>
    <!-- This is the header bar -->
    <Grid Height="64" Background="Red" />
    <Hub>
        <Hub.Header>
            <StackPanel Margin="-6,0,0,0">
                ...
            </StackPanel>
        </Hub.Header>

        <!-- actually just defined the margin in my ResourceDictionary to target all HubSections -->
        <HubSection Header="section 1" Margin="-2,-20,-4,8" />
        <HubSection Header="section 2" Margin="-2,-20,-4,8" />
    </Hub>
</Grid>

在WP 8.1上创建像枢轴一样的集线器

1 个答案: