如何使用System.Runtime.Serialization.Json在C#XAML // WPF中通过列表框绑定json数组

时间:2018-06-14 04:11:16

标签: c# json wpf

如何为" Telnet和Service"显示整个JSON数组。我已经让它显示了MachineName,Ping和Telnet和Service的第一个数据,但没有显示Telnet和Service的第二个数据。我使用的是System.Runtime.Serialization.Json而不是Newtonsoft。

我的xaml

<Window.DataContext>
    <ViewModels:Rootobject/>
</Window.DataContext>


<Grid>
    <ListBox x:Name="listboxMachine"                  
             HorizontalAlignment="Stretch" Background="Gray" BorderThickness="0"
             ScrollViewer.HorizontalScrollBarVisibility="Disabled"
             ScrollViewer.VerticalScrollBarVisibility="Auto"
             ItemsSource="{Binding server}">

        <ListBox.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel/>
            </ItemsPanelTemplate>
        </ListBox.ItemsPanel>

        <ListBox.ItemTemplate>
            <DataTemplate>
                <Border HorizontalAlignment="Stretch">
                    <StackPanel >
                        <Image Width="80" Source="http://fakeimg.pl/100x200/?text=Image_{i}" />
                        <TextBlock Text="{Binding MachineName}"/>
                        <TextBlock Text="{Binding Ping}"/>
                        <TextBlock Text="{Binding Telnet/Description}" />
                        <TextBlock Text="{Binding Telnet/Port}" />

                    </StackPanel>
                </Border>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

</Grid>

背后的代码

 public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        JsonRead();
    }

    public void JsonRead()
    {
        using (Stream stream = File.OpenRead("D:\\file.json"))
        {
            var serializer = new DataContractJsonSerializer(typeof(Rootobject));
            Rootobject rootobject = (Rootobject)serializer.ReadObject(stream);

            listboxMachine.ItemsSource = rootobject.server;


        }
    }


}

Json文件

{  "server": [
{
  "MachineName": "Server1",
  "Ping": "Server1.company.com",
  "Telnet": [
    {
      "Description": "IIS Application",
      "Port": 80
    },
    {
      "Description": "Java Application",
      "Port": 8080
    }
  ],
  "Service": [
    {
      "Description": "IIS Service",
      "Value": "iisSomething"
    },
    {
      "Description": "Java Service",
      "Value": "javaSomething"
    }
  ]
},
{
  "MachineName": "Server2",
  "Ping": "Server2.company.com",
  "Telnet": [
    {
      "Description": "IIS Application",
      "Port": 80
    },
    {
      "Description": "Java Application",
      "Port": 8080
    }
  ],
  "Service": [
    {
      "Description": "IIS Service",
      "Value": "iisSomething"
    },
    {
      "Description": "Java Service",
      "Value": "javaSomething"
    }
  ]
}
] }

Server.cs

public class Server
{
    public string MachineName { get; set; }
    public string Ping { get; set; }
    public List<Telnet> Telnet { get; set; }
    public List<Service> Service { get; set; }
}

public class Telnet
{
    public string Description { get; set; }
    public int Port { get; set; }
}

public class Service
{
    public string Description { get; set; }
    public string Value { get; set; }
}

MainModel.cs

public class Rootobject
{
    public List<Server> server { get; set; }
}

1 个答案:

答案 0 :(得分:1)

您无法在TextBlock中显示ItemsControl(Telnet列表),您需要使用ListBox <DataTemplate> <Border HorizontalAlignment="Stretch"> <StackPanel > <Image Width="80" Source="http://fakeimg.pl/100x200/?text=Image_{i}" /> <TextBlock Text="{Binding MachineName}"/> <TextBlock Text="{Binding Ping}"/> <ListBox ItemsSource="{Binding Path=Telnet}"> <ListBox.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <Label Margin="5, 0" Content="{Binding Description}" /> <Label Content="{Binding Port}" /> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> <ListBox ItemsSource="{Binding Path=Service}"> <ListBox.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <Label Margin="5, 0" Content="{Binding Description}" /> <Label Content="{Binding Value}" /> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> <!--<TextBlock Text="{Binding Telnet/Description}" /> <TextBlock Text="{Binding Telnet/Port}" />--> </StackPanel> </Border> </DataTemplate>

<div class="custom-select">
    <div>TEST 1</div>
    <div>TEST 2</div>
</div>