! 제품 버전을 정확하게 입력해 주세요.
제품 버전이 정확하게 기재되어 있지 않은 경우,
최신 버전을 기준으로 안내 드리므로
더욱 빠르고 명확한 안내를 위해
제품 버전을 정확하게 입력해 주세요!

[WinForms] 선택 영역을 표시하는 스타일 사용자 정의하기 > 온라인 스터디

본문 바로가기

4. 스타일 [WinForms] 선택 영역을 표시하는 스타일 사용자 정의하기

페이지 정보

작성자 GrapeCity 작성일 2021-10-26 09:57 조회 1,200회 댓글 0건

본문

Spread.NET에서는 다양한 스타일을 지정 가능합니다. 헤더 셀의 색상을 변경하거나, 드래그 하여 선택한 영역을 표시하는 색상을 변경하거나, 시트의 그리드를 표시하지 않는 것도 가능합니다.


이번 글에서는 선택 영역을 표시하는 스타일을 사용자 정의하는 두 가지 방법에 대해 살펴보도록 하겠습니다.


  • Selection Renderer 설정
  • ISelectionRenderer 인터페이스 설정
 


Selection Renderer 설정


Excel에서 한 번에 여러 인접셀들을 선택할 때, 필요한 영역을 드래그하여 블럭을 지정할 때가 많습니다. 이때 아래 영상과 같이 셀 색상이 변경되고 영역 바깥쪽 테두리에 두꺼운 선이 생기며 선택한 셀 영역이 표시됩니다. Spread.NET에서는 Selection Renderer를 변경하여 선택된 영역을 표시하는 스타일에 변화를 줄 수 있습니다.

ef1ebabf6273c16c7232abacc0970fdf_1635125276_8562.gif
 

Spread.NET에서 제공하는 SelectionRenderer의 종류는 다음과 같습니다.

  • FlatSelectionRenderer : 기본 Selection Renderer 중 하나로, 선택 영역의 배경색이 회색으로 표시됩니다.

  • DefaultSelectionRenderer : 기본 Selection Renderer 중 하나로, 선택 영역의 배경색이 파란색으로 표시됩니다.

  • GradientSelectionRenderer : 스프레드시트에서 선택 영역의 배경색을 그라데이션으로 표시합니다.

지금부터 여러가지 렌더링 스타일을 만들고, 콤보박스에서 원하는 스타일을 선택하여 선택영역 표시 스타일을 변경할 수 있는 기능을 구현해보도록 하겠습니다. 단계에 따라 함께 진행하여 보시길 바랍니다.

  1. 도구상자에서 fpSpread를 드래그하여 폼에 가져다 놓습니다.

    ef1ebabf6273c16c7232abacc0970fdf_1635125346_9242.png

  2. Spread - 우클릭 - 속성에서 Dock 속성을 Bottom으로 설정합니다. 스프레드 상단에 콤보박스가 들어갈만한 공간만 남겨두도록 사이즈를 적절히 조정합니다.

    ef1ebabf6273c16c7232abacc0970fdf_1635125368_2982.png

  3. 도구상자에서 ComboBox를 드래그하여 Spread 상단에 가져다 놓습니다.

    ef1ebabf6273c16c7232abacc0970fdf_1635125382_8229.png

  4. 도구상자에서 label을 드래그하여 콤보박스 좌측에 위치시킵니다. 속성 패널에서 label의 이름을 '렌더러'로 변경합니다.

    ef1ebabf6273c16c7232abacc0970fdf_1635125390_2041.png

  5. ComboBox.Items 속성선택할 항목(이름)을 입력합니다. Add(item) 또는 AddRange(items) 메소드로 항목을 추가할 수 있습니다. 본 예제에서는 AddRange() 메소드를 사용하여 3가지 그라데이션 선택 렌더러와 두 개의 기본 렌더러를 항목으로 넣어주었습니다.

    private void Form1_Load(object sender, EventArgs e)
    {
      String[] data = { "1번 스타일", "2번 스타일", "3번 스타일", "기본 스타일 1", "기본 스타일 2" };
      comboBox1.Items.AddRange(data);
    }

  6. 콤보박스를 더블 클릭하여, comboBox1_SelectedIndexChanged 메소드를 생성합니다.

    private void comboBox1_SelectedIndexChanged(object sender, EventArgs e)
    {
    // 정의
    }

    정의 부분에서는 선택된 항목에 따른 GradientSelectionRenderer를 생성하여 Spread의 SelectionRenderer로 설정하는 내용이 포함됩니다. GradientSelectionRenderer 생성자의 인자는 다음과 같습니다.

    • Color color1 : 그라데이션 초기 색상을 지정합니다.

    • Color color2 : 그라데이션 반대 끝 색상을 지정합니다.

    • LinearGradientMode mode : 선형 그라데이션 모드로, 수직/수평/전방 대각선/후방 대각선 모드가 있습니다.

    • int opacity : 불투명도를 지정합니다. 0에 가까울수록 색이 투명해집니다.

  7. comboBox1_SelectedIndexChanged 메소드를 다음과 같이 정의합니다. Spread.SelectionRenderer 속성에 원하는 SelectionRenderer를 할당하여 선택 렌더러를 변경할 수 있습니다.

    int sel = comboBox1.SelectedIndex;
    fpSpread1.SelectionRenderer = new FarPoint.Win.Spread.DefaultSelectionRenderer();
    // 콤보박스에서 선택된 항목의 인덱스에 따라 선택 렌더러가 변경됨.
    if (sel == 0)
    {
      // fpSpread1의 선택 렌더러를 그라데이션 렌더러(로 변경
      fpSpread1.SelectionRenderer = new GradientSelectionRenderer(
      Color.Pink, Color.PowderBlue, System.Drawing.Drawing2D.LinearGradientMode.Horizontal, 80);
    }
    else if (sel == 1)
    {
      // fpSpread1의 선택 렌더러를 그라데이션 렌더러로 변경
      fpSpread1.SelectionRenderer = new GradientSelectionRenderer(
      Color.Black, Color.Orange, System.Drawing.Drawing2D.LinearGradientMode.Vertical, 80);
    }
    else if (sel == 2)
    {
      // fpSpread1의 선택 렌더러를 그라데이션 렌더러로 변경
      fpSpread1.SelectionRenderer = new GradientSelectionRenderer(Color.White, Color.Red, System.Drawing.Drawing2D.LinearGradientMode.ForwardDiagonal, 80);
    }
    else if (sel == 3)
    {
    // fpSpread1의 선택 렌더러를 기본 선택 렌더러(파란색 배경)로 변경
    fpSpread1.SelectionRenderer = new FarPoint.Win.Spread.DefaultSelectionRenderer();
    }
    else
    {
      // fpSpread1의 선택 렌더러를 기본 선택 렌더러(회색 배경)로 변경
      fpSpread1.SelectionRenderer = new FarPoint.Win.Spread.FlatSelectionRenderer();
    }

  8. 코드를 실행하면, 콤보박스에서 선택한 항목에 따라 선택 영역을 표시하는 스타일이 달라짐을 확인할 수 있습니다.

    ef1ebabf6273c16c7232abacc0970fdf_1635125488_378.gif
     

샘플을 다운로드하여 전체 코드를 확인해 보실 수 있습니다.  

SelectionRenderer - 샘플 다운로드




ISelectionRenderer 인터페이스 설정


선택한 셀의 배경색을 임시로 변경하여 선택 영역을 표시하는 또다른 방법은, ISelectionRenderer 인터페이스를 사용하는 것입니다. ISelectionRenderer 인터페이스는 선택 영역 페인팅을 지원하는 인터페이스이며, PaintSelection 메소드를 사용하여 선택된 영역을 색칠할 수 있습니다. 다음 코드와 같이 ISelectionRenderer를 상속받는 SelectionClass를 정의하여 선택된 셀의 배경색을 임시로 변경할 수 있습니다.

public class SelectionRenderer : FarPoint.Win.Spread.ISelectionRenderer
{
  public void PaintSelection(Graphics g, int x, int y, int width, int height)
  {
  // 배경색 브러시 설정
      SolidBrush selectionBrush = new SolidBrush(Color.FromArgb(100, Color.Green));
        
      // x,y, 너비와 높이로 정의된 사각형의 내부를 앞서 설정한 브러시로 채우기
      g.FillRectangle(selectionBrush, x, y, width, height);
        
      // 리소스 정리
      selectionBrush.Dispose();
}
}


SolidBrush는 단일 색을 표현하는 브러시로, 사각형, 타원, 원형, 다각형 및 경로와 같은 그래픽 도형을 채우는 데 사용됩니다. SolidBrush(Color) 생성자로 객체를 생성할 수 있습니다. 예제 코드에서는 SolidBrush의 색을 Green으로 설정하였습니다.

Graphics.FillRectangle 메소드르르 사용하여, 좌표 쌍, 너비 및 높이로 지정된 사각형의 내부를 채웁니다. 해당 메소드의 인자로 앞서 설정한 SolidBrush를 넣어, 사각형의 내부를 Green 색상으로 채웁니다.

Form() 메소드에서 정의한 SelectionRenderer 객체를 생성하여 Spread.SelectionRenderer에 할당하고 결과를 확인해 보세요.

public Form1()
{
InitializeComponent();
 
// Spread.SelectionRenderer를 사용자정의한 선택 렌더러로 설정
SelectionRenderer sr = new SelectionRenderer();
fpSpread1.SelectionRenderer = sr;
}

ef1ebabf6273c16c7232abacc0970fdf_1635125594_789.gif
 

샘플을 다운로드하여 전체 코드를 확인해 보실 수 있습니다.  

ISelectionRenderer - 샘플 다운로드




지금 바로 Spread.NET을 다운로드하여 직접 테스트해보세요!

spnet.png

 

  • 페이스북으로 공유
  • 트위터로  공유
  • 링크 복사
  • 카카오톡으로 보내기

댓글목록

등록된 댓글이 없습니다.

메시어스 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기

태그1

인기글

더보기
  • 인기 게시물이 없습니다.
메시어스 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기
이메일 : sales-kor@mescius.com | 전화 : 1670-0583 | 경기도 과천시 과천대로 7길 33, 디테크타워 B동 1107호 메시어스(주) 대표자 : 허경명 | 사업자등록번호 : 123-84-00981 | 통신판매업신고번호 : 2013-경기안양-00331 ⓒ 2024 MESCIUS inc. All rights reserved.