如何将项目列表绑定到堆叠面板中的文本框 [英] How to bind a list of items to textbox inside stackpanel

查看:0
本文介绍了如何将项目列表绑定到堆叠面板中的文本框的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是Windows应用程序开发的新手,正在尝试实现如下显示:

标签编号:1标签编号:2标签编号:3//屏幕左端

标记编号:4,标记编号:5,以此类推。

如下所示:

我在Windows 10通用应用开发中执行此操作。

提前谢谢。

我的XAML代码:

 <StackPanel Orientation="Horizontal">
      <TextBlock Text="{x:Bind comment_tags}" />
 </StackPanel>

我的C#代码:

    public List<string> comments_tags = new List<string>();
    public MainPage()
    {
        this.InitializeComponent();
        for(int i =0; i < 20; i++)
        {
            comments_tags.Add("Tag no: " + i);
        }

     }

我尝试的新方法:

    public List<Border> comment_tags = new List<Border>();

        for (int i = 0; i < 20; i++)
        {
            Border b_temp = new Border();
            b_temp.CornerRadius = new CornerRadius(3);
            b_temp.Background = new SolidColorBrush(Colors.Aqua);
            TextBlock t = new TextBlock();
            t.Text = "Tag no: " + i;
            t.Foreground = new SolidColorBrush(Colors.Aqua)
            b_temp.Child = t;
            comments_tags.Add(b_temp);
        }

推荐答案

您处理标记的方法在这里不正确,您不需要文本框,您需要一个能够理解标记是什么以及如何处理它的控件。

查看herehere以了解如何实现此功能。

或最小实现可以是

<ItemsControl ItemsSource="{Binding Items}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>

        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Border BorderBrush="PowderBlue" CornerRadius="5" BorderThickness="2" Height="45" Margin="5" >
                    <TextBlock Text="{Binding}" VerticalAlignment="Center" Margin="5"/>
                </Border>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

和代码隐藏将是

 public MainWindow()
    {
        InitializeComponent();
        Items = new[] {"ABC", "DEF"};
        this.DataContext = this;
    }
    public string[] Items
    { get; set; }

这篇关于如何将项目列表绑定到堆叠面板中的文本框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆