C# Json 파일을 읽어 PropertyGrid 컨트롤 적용하는 방법

 

이번 포스팅은 Json 파일을 읽어 PropertyGrid에 적용하여 UI 상 나타내는 방법을 알아보겠습니다.

---

| Json 파일 읽기 

먼저 C#에서 Json 파일 읽는 방법을 알아보겠습니다.

{
  "IP": "192.168.0.1",
  "Port": 20001,
  "EQ": [
    {
      "Use": true,
      "EQNAME": "EQ1",
      "IP": "192.168.0.2",
      "Port": 20009,
      "WebPort": 20007,
      "BaseDir": "http://192.168.0.1:20001/"
    }
  ],
  "Mask": true,
  "Test": true,
  "Hold": true,
  "View": false
}

 

위와 같은 Setup.json 이라는 Json 파일을 읽어보겠습니다. 

C#에서 Json을 처리하기 위해서는 Newtonsoft.Json Nuget Package가 설치되어 있어야 합니다. 

 

도구 - Nuget 패키지 관리자 - Nuget 패키지 솔루션 관리자로 들어가서 설치해 주시면 됩니다.

 

 

설치가 완료되면 Json 패키지를 사용할 수 있습니다.

예제를 통해 알아보겠습니다.

 

먼저 UI를 구성해 줍니다. 

 

 

PropertyGrid와 Read 버튼 컨트롤로 Ui를 구성하여 

Read 버튼 클릭 시 Json 파일을 읽어 PropertyGrid 컨트롤에 시각화하겠습니다.

 

버튼을 더블 클릭하면 버튼 클릭 이벤트가 만들어지며 

json을 읽어 PropertyGrid에 적용해 보겠습니다.

 

예제) Read 버튼 클릭 이벤트 

private void btnReadJson_Click(object sender, EventArgs e)
{
    string jsonFilePath = filePath+"Setup.json";
    string json = File.ReadAllText(jsonFilePath);
    JObject jsonObj = JObject.Parse(json);
    this.prgJson.SelectedObject = jsonObj;
}

 

결과) 

 

결과를 보시면 Json 파일의 EQ 항목이 배열로 되어 있는데

PropertyGrid에서 배열을 그대로 출력하는 것을 볼 수 있습니다.

EQ 항목도 다른 항목과 똑같이 UI에 표시되게 하겠습니다.

---

| Json 파일 읽기 (Json 배열 항목 동적 처리)

먼저 Json안의 배열 항목을 처리하려면 클래스를 따로 만들어 주어야 합니다.

 

예제) Json 항목 클래스 구현 

public class EQ
{
    public bool Use { get; set; }
    public string EQNAME { get; set; }
    public string IP { get; set; }
    public int Port { get; set; }
    public int WebPort { get; set; }
    public string BaseDir { get; set; }
}

public class Root
{
    public string IP { get; set; }
    public int Port { get; set; }
    public List<EQ> EQ { get; set; }
    public bool Mask { get; set; }
    public bool Test { get; set; }
    public bool Hold { get; set; }
    public bool View { get; set; }
}

 

Setup.json 파일의 EQ 항목과 나머지 항목을 클래스로 만들어주었습니다.

 

그리고 동일하게 Read 버튼 클릭 시 Json 파일을 읽어 PropertyGrid 항목으로 만들어주는 코드를 구현합니다.

 

예제) Read 버튼 클릭 이벤트 

private void btnReadJson_Click(object sender, EventArgs e)
{
     using (StreamReader r = new StreamReader("yourFilePath.json"))
    {
        string json = r.ReadToEnd();
        Root myDeserializedClass = JsonConvert.DeserializeObject<Root>(json);
        propertyGrid1.SelectedObject = myDeserializedClass;
    }
}

 

 

결과)

 

보시면 앞서 코드 구현을 한 것은 EQ가 배열로 나왔지만

EQ 항목을 클래스로 구현하여 Json 파일을 읽으면 컬렉션으로 Property 그리드에 표현되며

항목을 확인할 수 있습니다.

---

| 마무리 

하지만 EQ 항목을 배열, 컬렉션 항목으로 나타내기 싫고

항목 전체를 PropertyGrid에 표현하려면 앞서 만든 Root 클래스에 

EQ 항목을 하나씩 다 넣어주는 방법이 있습니다.

public class Root
{
    public string IP { get; set; }
    public int Port { get; set; }
    public bool Use { get; set; }
    public string EQNAME { get; set; }
    public string EQIP { get; set; }
    public int EQPort { get; set; }
    public int WebPort { get; set; }
    public string BaseDir { get; set; }
    public bool Mask { get; set; }
    public bool Test { get; set; }
    public bool Hold { get; set; }
    public bool View { get; set; }
}

 

이는 Json 파일도 수정해야 하고 EQ 항목이 많을 시 굉장히 불편합니다.

이렇게 하지 않고 EQ 항목을 나태내고 싶으면 PropertyGrid를 사용하시면 안 됩니다.

PropertyGrid는 객체의 속성을 자동으로 읽어 표시해 주는 컨트롤이기 때문에,

복잡한 구조의 객체를 다룰 경우 제한적일 수 있습니다.

 

따라서 복잡한 구조의 객체를 다루신다면 사용자 정의 UI를 만들어 각 속성을 개별적으로 처리해야 합니다. 

 

이렇게 Json 파일을 PropertyGrid에 적용시키는 방법에 대해 알아봤습니다.

틀린 점이나 질문이 있으시면 댓글로 남겨주세요!

 

 

감사합니다. :)