Question

我试图动态地将几个单独的文本块添加到网格中，以便向网格添加元素将填充下一个打开的单元格。

等等

当删除任何元素时，应该移动后面的每个元素以填充任何空单元格，这样如果删除2,5,6（一次一个），它将如下所示：

1 3
4 7
8 ...

我的XAML和代码如下：

<StackPanel x:Name="NumbersStackPanel">
                <TextBlock Text="Numbers: "/>
                <Grid x:Name="NumbersGrid">
                    <TextBox x:Name="SearchNumbers"/>
                </Grid>
            </StackPanel>

CS：

            TextBlock newTextBlock = new TextBlock();
            newTextBlock.Visibility = Windows.UI.Xaml.Visibility.Visible;
            newTextBlock.Foreground = new SolidColorBrush(Colors.Black);
            newTextBlock.FontWeight = Windows.UI.Text.FontWeights.SemiBold;
            newTextBlock.FontFamily = new Windows.UI.Xaml.Media.FontFamily("Segoe UI Semilight");
            newTextBlock.Margin = new Thickness(0, 5, 4, 0);
            newTextBlock.TextWrapping = TextWrapping.WrapWholeWords;
            newTextBlock.FontSize = 18;

            newTextBlock.Text = NumbersModelObj.Number + "; ";
            newTextBlock.Tag = NumbersModelObj.NumberId;
            textArray.Add(newTextBlock);

            NumbersGrid.Children.Insert(NumbersCount, newTextBlock);
            NumbersCount ++;

我已尝试嵌套for循环给定元素的值（NumbersCount），但未成功将超过2个元素添加到不同的单元格到网格中的不同单元格

有没有相对简单/干净的解决方案来实现这一目标？

Answer 1

我发现了我在这里找到的确切内容：

http://windowsapptutorials.com/windows-phone/ui/wrap-grid-with-variable-sized-items/

希望这有助于某些人下线。

Answer 2

您正在寻找的是一个名为UniformGrid的人。不幸的是，它没有从桌面WPF移植到Windows Phone WPF。

然而，我做了一些谷歌搜索，发现了这个：

<强> UniformGrid.cs

using Windows.Foundation;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace App1 // replace with your namespace, of course
{
    public class UniformGrid : Panel
    {
        protected override Size MeasureOverride(Size availableSize)
        {
            var itemWidth = availableSize.Width / Columns;
            foreach (FrameworkElement child in Children)
            {
                child.Measure(new Size(120, 120));
            }
            return new Size(availableSize.Width, availableSize.Width);
        }

        protected override Size ArrangeOverride(Size finalSize)
        {
            Size cellSize = new Size(finalSize.Width / Columns, finalSize.Width / Columns);
            int row = 0, col = 0;
            foreach (UIElement child in Children)
            {
                child.Arrange(new Rect(new Point(cellSize.Width * col, cellSize.Height * row), cellSize));
                if (++col == Columns)
                {
                    row++;
                    col = 0;
                }
            }
            return finalSize;

        }

        public int Columns
        {
            get { return (int)GetValue(ColumnsProperty); }
            set { SetValue(ColumnsProperty, value); }
        }

        public int Rows
        {
            get { return (int)GetValue(RowsProperty); }
            set { SetValue(RowsProperty, value); }
        }

        public static readonly DependencyProperty ColumnsProperty =
    DependencyProperty.Register("Columns", typeof(int), typeof(UniformGrid), new PropertyMetadata(1, OnColumnsChanged));


        public static readonly DependencyProperty RowsProperty =
    DependencyProperty.Register("Rows", typeof(int), typeof(UniformGrid), new PropertyMetadata(1, OnRowsChanged));

        static void OnColumnsChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e)
        {
            int cols = (int)e.NewValue;
            if (cols < 1)
                ((UniformGrid)obj).Columns = 1;
        }

        static void OnRowsChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e)
        {
            int rows = (int)e.NewValue;
            if (rows < 1)
                ((UniformGrid)obj).Rows = 1;
        }

    }
}

资源： https://social.msdn.microsoft.com/Forums/windowsapps/en-US/3254c8ff-a7ad-4346-b353-457cd6ac7a58/uwpcreating-a-uniformgrid-for-listview?forum=wpdevelop

如何使用它：

将UniformGrid.cs导入您的项目;把它放在你认为合适的地方。
适当更新命名空间（在Xaml中使用它时，请记住此命名空间）。
以下是一个例子：

<强> MainPage.xaml中

<Page
    x:Class="App1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:custom="using:App1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    >

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

        <StackPanel x:Name="NumbersStackPanel" Orientation="Vertical">
            <TextBlock Text="Numbers: "/>
            <custom:UniformGrid x:Name="NumbersGrid" Columns="2">
                <custom:UniformGrid.Resources>
                    <Style TargetType="TextBox">
                        <Setter Property="Visibility" Value="Visible" />
                        <Setter Property="Foreground" Value="Black" />
                        <Setter Property="FontWeight" Value="SemiBold" />
                        <Setter Property="FontFamily" Value="Segoe UI Semilight" />
                        <Setter Property="Margin" Value="0, 5, 4, 0" />
                        <Setter Property="TextWrapping" Value="WrapWholeWords" />
                        <Setter Property="FontSize" Value="18" />
                    </Style>
                </custom:UniformGrid.Resources>
                <TextBox Text="1" />
                <TextBox Text="2" />
                <TextBox Text="3" />
            </custom:UniformGrid>
        </StackPanel>

    </Grid>
</Page>

注意：我建议在XAML中对文本框进行格式化，如图所示。实现的样式定位UniformGrid中的所有TextBox。

<强> MainPage.xaml.cs中

using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Navigation;

namespace App1
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            base.OnNavigatedTo(e);
            AddText("hello");
            RemoveText("2");
            AddText("Goodbye");
            RemoveText("hello");
            RemoveText("1");
        }

        private void AddText(string text)
        {
            TextBox tb = new TextBox();
            tb.Text = text;
            NumbersGrid.Children.Add(tb);
        }

        private void RemoveText(string text)
        {
            foreach(UIElement child in NumbersGrid.Children)
            {
                TextBox tb = (TextBox)child;
                if (tb.Text.Equals(text))
                {
                    NumbersGrid.Children.Remove(tb);
                }
            }
        }

    }
}

Windows Phone 8.1 C＃，在网格中动态添加/删除TextBlocks

2 个答案: