WPF로 DataGrid 컴포넌트 이용 시 발생한 문제 해결 과정을 정리하였습니다.

🟤 DataGrid를 이용하여 TreeView 구현하기

TreeView를 이용하여 동적으로 TreeViewItem을 생성하고 구현하였습니다. 하지만 조금 더 깔끔한 화면 구성을 위해 DataGrid로 변경하기로 결정하였습니다.

🔍 DataGrid로 TreeView 구현한 오픈소스 검색

• 많은 유료버전의 컨트롤을 제외하고 TreeView 구조를 유지하면서도 Name 컬럼을 제가 원하는 컴포넌트를 구성하여 동적으로 구성할 수 있는 소스코드를 찾았습니다.

  참조한 소스코드 : WPF TreeGrid using a DataGrid

🤨 스크롤할 때 발생하는 이 문제! 오픈소스 버그인가?

1. 컨트롤 값을 변경해도 binding한 변수의 set 함수 호출이 되지 않음

• 디버깅 메시지를 출력하게 하거나 디버깅 포인트를 지정한 후 실행하였을 때 아무 이벤트가 발생하지 않았습니다.

  2. 스크롤이 생기는 경우 스크롤을 위아래로 움직일 때 체크박스 랜덤으로 선택 및 해제되는 현상

• Template을 여러 종류로 구현하여 데이터 형태에 따라 표출해야해서 체크박스를 포함한 다양한 컨트롤을 사용할 때 문제가 발생 시 아주 곤란했습니다.
• 텍스트박스의 값을 변경해도 스크롤 발생 시 기존 값으로 다시 표출되는 현상이 발생했습니다.

  3. 스크롤을 계속 움직일 경우 프로그램 뻗는 현상 혹은 화면 사라짐 현상 발생

• 1번과 2번 문제는 binding 포기하더라도 해결할 수 있는 방법이 있었지만 3번 스크롤 문제는 심각하게 다가와서 다시 고민에 빠졌습니다.

🤦‍♀️ DataGrid 스크롤 문제 해결방법 찾기

동적 템플릿 구성에 대한 간단한 테스트 후 기존 소스코드에 다 적용한 상태였기 때문에 마지막 단계에서 방향을 돌려야 한다는 것은 아주 큰 리스크였습니다.

구글링 중 DataGrid 스크롤 문제를 언급하신 TISTORY 블로그를 드디어 찾아내게 됩니다. 무려 2010년에 쓰여진 실버라이트 글이었는데 저에게 큰 도움이 되었습니다.👍

<!-- MainWindow.xaml 파일 -->
<ScrollViewer VerticalScrollBarVisibility="Auto">
   <DataGrid  AutoGenerateColumns="False" Name="grid" CanUserAddRows="False"
              VerticalScrollBarVisibility="Hidden">
   ...
   </DataGrid>
</ScrollViewer>

• 여기서 중요한 부분은 DataGrid에서 자동으로 생성되는 Scroll을 사용하지 않고 ScrollViewer를 감싸서 DataGrid를 사용해야 한다는 부분이었습니다. ScrollViewer의 VerticalScrollBarVisibility="Auto", DataGrid의 VerticalScrollBarVisibility="Hidden" 속성이 핵심입니다.

◽ DataGrid 속성 값 적용 후 테스트

• 아래 위로 스크롤을 움직였을 때 체크박스 해제가 되지 않습니다.

• 체크박스를 선택 시 연결된 Binding 변수의 set 함수가 호출됩니다. 하지만 완벽하게 처리되지 않고 여전히 이벤트가 호출되지 않는 현상이 발생했습니다.😢

◽ DataGrid 속성 값 적용 후 보안점

1. 마우스 스크롤 시 ScrollViewer 추가 후 생긴 스크롤 위에서만 마우스 휠로 동작함 (✔해결)

기존에는 DataGrid에서 생긴 스크롤을 사용하여 마우스 휠을 어느 영역에서 하든 위아래 이동이 가능했다면 ScrollViewer를 사용하면 DataGrid 영역 내에서 스크롤 이동이 마우스 휠로 동작하지 않게 됩니다.

• DataGrid에 전달된 마우스 휠 이벤트가 ScrollViewer로 전달될 수 있도록 PreviewMouseWheel 이벤트를 추가한 후 코드 구현을 합니다. 이렇게 하면 DataGrid 영역 내에서 마우스 휠로 스크롤이 움직이게 됩니다.

  <!-- MainWindow.xaml 파일 -->
  <ScrollViewer VerticalScrollBarVisibility="Auto" Name="scrollViewer">
   <DataGrid  AutoGenerateColumns="False" Name="grid" CanUserAddRows="False"
              VerticalScrollBarVisibility="Hidden"
              PreviewMouseWheel="DataGrid_PreviewMouseWheel">
   ...
   </DataGrid>
  </ScrollViewer>

  // MainWindow.xaml.cs
  private void DataGrid_PreviewMouseWheel(object sender, MouseWheelEventArgs e){ 
    scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset - e.Delta / 3);
  }

  2. DataGrid의 동적 컨트롤 Binding 이벤트 발생하지 않음 (✔해결)

  간소화한 소스코드로 테스트 해 본 컨트롤은 TextBox와 CheckBox입니다. 해결방법은 Binding할 때 UpdateSourceTrigger를 추가해 주면 됩니다.
• CheckBox의 경우 UpdateSourceTrigger 이벤트로 값이 변경될 때마다 감지될 수 있게 PropertyChanged로 설정하였습니다.
• TextBox의 경우 한글자 입력할 때마다 이벤트가 발생하므로 포커스가 다른 곳으로 이동할 때까지 입력을 받은 후 이벤트를 받고자 LostFocus로 설정하였습니다.

  <DataGrid.Columns>
   <DataGridTemplateColumn Header="Name">
         <DataGridTemplateColumn.CellTemplate>         
         <DataTemplate>
            ...
            <TextBox Text="{Binding Name, Mode=TwoWay, UpdateSourceTrigger=LostFocus}"/>
            <CheckBox IsChecked="{Binding IsNameChecked, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
            ...
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
  </DataGrid.Columns>

3. DataGrid의 Header가 스크롤을 내리는 경우 고정되지 않음 (미해결)

DataGrid를 ScrollViewer로 감싸줬으니 어쩔 수 없는 부분으로 보이긴 하지만 구현하는 입장에서는 아쉬운 부분입니다.

• 스크롤 내리기 전 Header가 보이는 모습
• 스크롤 내린 후 Header가 보이지 않는 모습

[참조사이트]

• WPF TreeGrid using a DataGrid
• TISTORY
• Mouse scroll not working in a scroll viewer with a wpf datagrid and additional UI elements

📌 PDUs

• run time 실행을 위해 Support autmatic encoding and decoding of optn types at run time을 선택합니다.

📌 Encoding rules

• 원하는 인코딩 방식을 선택합니다. (인코딩 방식은 라이브러리 구입 시 활성화됩니다.)

📌 Generated files

◽ Header files

• Prefix를 붙여서 생성된 파일 내부의 구조체 및 선언 부분에 적용합니다.
• C/C++ 지원 헤더 파일을 생성합니다.
• 주석 스타일을 C/C++ 스타일로 적용합니다.
• C/C++에서 쓰는 키워드와 겹치는 이름이 있는 경우 오류가 나지 않도록 Reserved words로 추가해 줍니다.

📌 Encoder/decoder

• Automatically encode/decode open types를 선택합니다.
• Treat undefined component relations as valid for extensible info object sets를 선택합니다.

※ OSS 라이브러리로 사용하는 언어는 C 언어이며, 더 좋은 기능이 있을 수도 있으나 제가 자주 쓰는 기능으로 정리된 것입니다.

업무적으로 Azure Eventhub를 연동할 일이 생겼습니다. 공식 사이트에서 API 제공하는 언어를 살펴보니 대표적으로 Python, Java, C(넣기만 가능)가 있습니다.

C 언어 사용하지 못한 이유

1. 원래 익숙한 언어는 C 언어였지만 넣기만 가능했고, 그나마도 테스트를 했더니 길이가 긴 텍스트(대용량 텍스트)의 경우 제대로 넣지 못하는 문제를 발견했습니다.

2. 랜덤으로 생성되는 연결문자열에 '/(슬래시)'가 있는 경우 내부적으로 문자열 끝으로 인식하는 것인지 접속할 수 없는 현상이 있었습니다. 그래서 '/(슬래시)'가 없을 때까지 연결문자열을 재생성하여 사용하였습니다.

Java를 개발언어로 선택

프로그램 특성 상 네트워크 통신도 필요했고 멀티쓰레드 환경에서 안정적인 성능이 나올 언어로 Java를 선택하였습니다. 너무 오랜만이라 사용하는 클래스도 많이 달라져서 낯설었지만 적응할 시간도 없이 개발을 시작하였습니다. 리눅스 환경에서 Java 구현은 처음이었지만 Eclipse는 친근해서 그나마 다행이었습니다.

아파치 메이븐(Apache Maven)은 자바용 프로젝트 관리 도구이다. 아파치 앤트의 대안으로 만들어졌다. 아파치 라이선스로 배포되는 오픈 소스 소프트웨어이다. - 위키백과 -

이전에 개발한 내용이지만 정리를 위해 Windows에서 다시 실행해보았습니다.

⚙ 사전 준비사항

1. JDK(JRE) 설치 2. Maven 설치

⌨ Maven Project 구현

1. Maven Project 생성하기

• New -> Maven Project 실행 후 Create a simple project 앞에 체크박스를 선택한 후 Next를 눌러줍니다.

• group id는 프로젝트를 구현하는 팀의 아이디로 저는 간단히 rnd.dev라고 입력하였습니다.

• artifact id는 프로젝트 식별 아이디로 프로젝트 이름이라고 생각하시면 됩니다. 이 이름은 프로젝트 최상위 폴더 이름으로 사용됩니다.

• Finish를 누른 후 Project Explorer를 확인하면 그림과 같은 구조를 확인할 수 있습니다.

📄 pom.xml 중요파일

POM(Project Object Model) 파일 내부에 앞으로 Maven Project에서 사용할 라이브러리를 코드로 추가하면 자동으로 프로젝트에 라이브러리 파일을 로드해서 연결해 줍니다. 추가 삭제 또한 모두 이 파일을 수정해서 업데이트만 하면 되므로 관리하기 편합니다.

2. pom.xml 라이브러리 추가하기

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>rnd.dev</groupId>
  <artifactId>eventhub</artifactId>
  <version>0.0.1-SNAPSHOT</version>
</project>

• 기본 pom.xml 파일은 처음 프로젝트 생성 시 입력한 값들로 채워져 있습니다. 마지막 줄 </project> 닫는 태그 앞에 <dependencies> ... </dependencies>를 추가하여 라이브러리를 로드합니다.

Maven Repository에 가서 azure-messaging-eventhubs를 검색했습니다. 원하는 라이브러리가 있다면 모두 검색 가능합니다.

• 이렇게 Mavan 코드가 있으므로 복사해서 붙여넣기만 해주면 됩니다.

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>rnd.dev</groupId>
  <artifactId>eventhub</artifactId>
  <version>0.0.1-SNAPSHOT</version>

  <dependencies>
    <dependency>
      <groupId>com.azure</groupId>
      <artifactId>azure-messaging-eventhubs</artifactId>
      <version>5.11.2</version>
    </dependency>
  </dependencies>
</project>

• 코드를 입력한 후 저장하면 제일 하단 오른쪽에 상태표시가 나타납니다. Building부터 Downloading까지 진행됩니다. 그리고 Project Explorer에는 Maven Denpendencies라는 폴더가 새로 추가되었습니다.

• 접혀있던 Maven Dependencies를 열면 따로 추가하지 않은 관련 파일까지 모두 추가된 것을 확인할 수 있습니다.

그럼 간략히 Main 함수를 정의하여 프로젝트가 실행되는 지 확인해보겠습니다.

3. Eclipse 환경설정하기

• project 우클릭 properties를 실행하여 인코딩 설정을 MS949에서 UTF-8로 변경하였습니다.

• properties안에 Java Build Path를 선택합니다. 기본으로 잡힌 Java 버전이 낮아서 Libraries 탭에 JRE System Library를 클릭 후 Edit 버튼을 눌러줍니다.

• Execution environment에서 기본 목록으로 표시되는 Java 버전을 선택하셔도 되고 저처럼 Alternate JRE라고 해서 installed JREs를 누른 후 내 PC에 설치된 jdk나 jre를 참조하셔도 됩니다.

• Search를 누른 후 Java 설치 폴더를 지정했더니 기본 jre가 있어서 제가 설치한 것은 jre(1)로 잡혔습니다. 더블 클릭해서 JRE Name을 수정할 수 있습니다.

• 메뉴의 Window -> Preferences 실행합니다. Maven - Installations에서 기본으로 선택한 EMBEDED 체크박스 해제 후 Add를 눌러 설치 디렉토리를 선택합니다. Apply and Close를 선택하여 종료합니다.

4. Main 함수 클래스 생성하기

• project 아래 src/main/java 우클릭 New -> Class를 선택합니다.

• 저는 Main함수를 만들기 위해서 체크박스를 선택하였고 위에 Package와 Name을 원하시는대로 적어주시면 됩니다.

package eventhub;

public class EventhubSender {

    public static void main(String[] args) {
        // TODO Auto-generated method stub
        System.out.println("Hi");
    }

}

• 기존에 Java 컴파일하듯이 EventhubSender.java 파일 우클릭 후 Debug As -> Java Application 혹은 Run As -> Java Application 실행하여 실행 결과를 볼 수 있습니다.

이렇게 하면 Maven으로 왜 구현했을까 의문이 들 것입니다. Maven으로 실행하기 위해 pom.xml 파일에 추가 작업이 필요합니다.

5. pom.xml 빌드환경 추가하기

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>rnd.dev</groupId>
  <artifactId>eventhub</artifactId>
  <version>0.0.1-SNAPSHOT</version>

  <properties>
    <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    <maven.compiler.source>1.8</maven.compiler.source>
    <maven.compiler.target>1.8</maven.compiler.target>
  </properties>

  <dependencies>
    <dependency>
      <groupId>com.azure</groupId>
      <artifactId>azure-messaging-eventhubs</artifactId>
      <version>5.11.2</version>
    </dependency>
  </dependencies>
  <build>
    <pluginManagement><!-- lock down plugins versions to avoid using Maven defaults (may be moved to parent pom) -->
      <plugins>
        <!-- clean lifecycle, see https://maven.apache.org/ref/current/maven-core/lifecycles.html#clean_Lifecycle -->
        <plugin>
          <artifactId>maven-clean-plugin</artifactId>
          <version>3.1.0</version>
        </plugin>
        <!-- default lifecycle, jar packaging: see https://maven.apache.org/ref/current/maven-core/default-bindings.html#Plugin_bindings_for_jar_packaging -->
        <plugin>
          <artifactId>maven-resources-plugin</artifactId>
          <version>3.0.2</version>
        </plugin>
        <plugin>
          <artifactId>maven-compiler-plugin</artifactId>
          <version>3.8.0</version>
          <configuration>
            <source>1.8</source>
            <target>1.8</target>
          </configuration>
        </plugin>
        <plugin>
          <artifactId>maven-surefire-plugin</artifactId>
          <version>2.22.1</version>
        </plugin>
        <plugin>
          <artifactId>maven-jar-plugin</artifactId>
          <version>3.0.2</version>
          <configuration>
            <archive>
              <manifest>
                <addClasspath>true</addClasspath>
                <classpathPrefix>lib/</classpathPrefix>
                <mainClass>eventhub.EventhubSender</mainClass>
              </manifest>
            </archive>
          </configuration>
        </plugin>
        <plugin>
          <artifactId>maven-install-plugin</artifactId>
          <version>2.5.2</version>
        </plugin>
        <plugin>
          <artifactId>maven-deploy-plugin</artifactId>
          <version>2.8.2</version>
        </plugin>
        <!-- site lifecycle, see https://maven.apache.org/ref/current/maven-core/lifecycles.html#site_Lifecycle -->
        <plugin>
          <artifactId>maven-site-plugin</artifactId>
          <version>3.7.1</version>
        </plugin>
        <plugin>
          <artifactId>maven-project-info-reports-plugin</artifactId>
          <version>3.0.0</version>
        </plugin>
        <plugin>
          <groupId>org.apache.maven.plugins</groupId>
          <artifactId>maven-assembly-plugin</artifactId>
          <version>3.3.0</version>
          <configuration>
              <archive>
              <manifest>
                <mainClass>eventhub.EventhubSender</mainClass>
              </manifest>
            </archive>
            <descriptorRefs>
              <descriptorRef>jar-with-dependencies</descriptorRef>
            </descriptorRefs>
          </configuration>
        </plugin>
      </plugins>
    </pluginManagement>
    <resources>
      <resource>
        <directory>src/main/resources</directory>
      </resource>
    </resources>
  </build>
</project>

• <properties> 태그가 추가되었습니다. 그리고 <build> 라는 엄청 긴 태그가 추가되었습니다. 여기에 들어가 있는 plugin 기능들을 이제 Eclipse에서 확인할 수 있습니다.

• 1.8이라고 되어 있는 부분은 JRE Library 설정에서 제가 선택한 자바 버전입니다. (사용하는 버전에 따라 수정하셔야 합니다.)

• <mainClass> 태그는 Maven에게 Main 함수가 있는 클래스를 알려주는 부분이라 패키지명부터 입력하시면 됩니다. (eventhub.EventhubSender 부분 수정 필요합니다.)

6. Maven 구성 설정하기

• File -> Restart로 이클립스를 재시작한 후 project 우클릭 -> Run As 눌렀을 때 새로운 메뉴가 추가된 것을 확인할 수 있습니다. 여기서 Run Configuration을 선택합니다.

• Maven Build 우클릭 -> New Configuration 누른 후 Goals에 아래와 같이 추가합니다.

clean compile assembly:single

• 입력 후 Apply한 후 Run을 실행합니다. Run Configuration에서 추가하였지만 Debug Configuration으로 접근해도 동일한 Configuration을 Debug로 실행할 수 있습니다.

• Eclipse 하단에 로그가 찍히면서 Java를 실행할 때와는 다른 화면이 출력됩니다. 빌드한 결과물은 jar 파일로 생성되었습니다.

• workspace 내 프로젝트 폴더 안에 target 폴더에 있는 것을 확인할 수 있습니다.

🙅‍♀️ 주의할 점

빌드 진행 중일 때 target 폴더를 접근하지 않도록 해야 합니다.

cmd를 열어서 바로 실행해야지 하며 해당 경로로 path 지정하여 대기하고 있거나 target 폴더를 파일 탐색기에서 열어 놓은 경우 Maven 빌드를 할 때마다 target 폴더를 재생성하는데 열린 폴더는 삭제를 할 수 없어 자꾸 ERROR가 발생합니다.

Failed to execute goal org.apache.maven.plugins:maven-clean-plugin:3.1.0:clean

7. 배포된 jar 파일 실행하기

java -jar -Dfile.encoding=UTF-8 ./eventhub-0.0.1-SNAPSHOT-jar-with-dependencies.jar

• java 명령으로 실행하니 Hi 결과를 cmd에서도 확인할 수 있었습니다.

• 라이브러리나 plugin 버전이 바뀌었을 때도 파일 교체를 따로 할 필요 없이 pom.xml 파일만 수정한 후 project 우클릭 -> Maven -> Update Project OK를 실행합니다.

  이 과정은 Eclipse와 pom.xml 설정 간에 동기화를 위한 것이므로 Maven을 잘 활용하기 위해서는 염두해두어야 하는 과정입니다.

이제 환경설정을 해놓았으니 Java로 계속 구현하고 배포까지 가능합니다.