WPF布局的Trello板

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了WPF布局的Trello板相关的知识,希望对你有一定的参考价值。

我试图在WPF上为我的课程项目做一个Trello的克隆。

我的板子的布局有一些问题。 例如 我希望我的列表可以滚动其内容,高度取决于内容。如此 但现在我的清单正随着最大容器的高度而不断延伸。如此 这是我的部分代码,有注释,它修复了第一个错误,但又产生了另一个错误。卷轴不灵

也许有人能帮我。谅谅

<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled" Margin="0 0 0 5">
                <ItemsControl ItemsSource="{Binding CurrentBoard.Lists}">
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <StackPanel Orientation="Horizontal" VerticalAlignment="Top" Margin="0 0 0 20"/>
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>

                            <!--<Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="auto"/>
                                </Grid.RowDefinitions>

                                <Grid Grid.Row="0">-->
                            <Border CornerRadius="3" Width="272" MinHeight="78" Background="#ebecf0" Margin="8 0 4 0">
                                <Grid>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto"/>
                                        <RowDefinition Height="*"/>
                                        <RowDefinition Height="38" />
                                    </Grid.RowDefinitions>

                                    <Grid Grid.Row="0">
                                        <TextBlock Text="{Binding Title}" Foreground="#172b4d" FontSize="16" 
                                                    FontWeight="DemiBold" TextWrapping="Wrap" Padding="8 10"/>
                                    </Grid>

                                    <Grid Grid.Row="1">
                                        <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
                                            <ItemsControl ItemsSource="{Binding Cards}">
                                                <ItemsControl.ItemsPanel>
                                                    <ItemsPanelTemplate>
                                                        <StackPanel Orientation="Vertical" VerticalAlignment="Top" />
                                                    </ItemsPanelTemplate>
                                                </ItemsControl.ItemsPanel>
                                                <ItemsControl.ItemTemplate>
                                                    <DataTemplate>
                                                        <Border CornerRadius="3" MinHeight="44" Background="White" Margin="8 0 8 8" Padding="8 6 8 2">
                                                            <Border.Effect>
                                                                <DropShadowEffect BlurRadius="1.5" Color="LightGray" Direction="-90" RenderingBias="Quality" ShadowDepth="1"/>
                                                            </Border.Effect>
                                                            <Grid>
                                                                <Grid.RowDefinitions>
                                                                    <RowDefinition Height="auto"/>
                                                                </Grid.RowDefinitions>

                                                                <Grid Grid.Row="0">
                                                                    <TextBlock Text="{Binding Title}" Foreground="#172b4d" FontSize="14" Margin="0 0 0 4"/>
                                                                </Grid>
                                                            </Grid>
                                                        </Border>
                                                    </DataTemplate>
                                                </ItemsControl.ItemTemplate>
                                            </ItemsControl>
                                        </ScrollViewer>
                                    </Grid>

                                    <Grid Grid.Row="2">
                                        <Button
                                            Style="{StaticResource MaterialDesignOutlinedButton}"
                                            ToolTip="MaterialDesignOutlinedButton"
                                            Foreground="#5e6c84"
                                            >
                                            + Add another card
                                        </Button>
                                    </Grid>
                                </Grid>
                            </Border>
                            <!--</Grid>
                            </Grid>-->
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </ScrollViewer>
答案

只要添加 VerticalAlignment="Top" 对你的 <Border> 标签。

以上是关于WPF布局的Trello板的主要内容,如果未能解决你的问题,请参考以下文章

Trello 如何在 MongoDB 中存储数据? (每板收集?)

WPF实用小工具

我应该为情节提要效果使用哪些 WPF 布局和控件

在WPF中,有没有办法在后面的代码中获取故事板动画值的当前值?

在使用ViewPager时尝试从其父活动修改片段时出现空指针异常

重新启动 WPF 故事板