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

WinForms InputPanel을 사용하여 매매 계약서를 작성하는 방법 > 온라인 스터디

본문 바로가기

ComponentOne

온라인 스터디

Winforms윈폼 WinForms InputPanel을 사용하여 매매 계약서를 작성하는 방법

페이지 정보

작성자 GrapeCity 작성일 2022-04-12 15:03 조회 754회 댓글 0건

본문

InputPanel은 모든 기능을 갖춘 데이터 입력 양식의 역할을 하는 인기 있는 WinForms 컴포넌트입니다. 강력한 데이터 입력 응용 프로그램을 만들기 위해 디자인, 레이아웃, 모양, 동작을 제어하는 InputPanel에서 복수의 입력 컴포넌트를 관리합니다.


모든 C1InputPanel 입력 컴포넌트에는 프로그래밍 작업을 보다 쉽고 일관성 있게 만들어 주는 공통된 스타일, 속성, 메서드 및 이벤트 세트가 있습니다. 이 간단한 설정은 유지 관리의 필요성이 적기 때문에 생산성 향상에 도움이 됩니다.


InputPanel 컨트롤은 하위 컨트롤을 행과 열의 형식으로 배치하는 데 사용할 수 있는 InputGridPanel 컴포넌트를 제공합니다. 또한 종속 컴포넌트를 겹치지 않도록 자동으로 정렬하거나 크기를 조정할 때 왜곡되지 않도록 합니다.


행과 열로 구성된 그리드는 어떤 형식 요소이든 포함할 수 있으며, 다양한 크기의 셀처럼 보이고 병합도 가능합니다. InputGridPanel에 대한 내용은 여기에서 자세히 알아보세요.


응용 프로그램에서 InputGridPanel을 활용하는 방법을 보여주기 위해 판매자와 구매자의 세부 정보가 포함된 제품 매매 계약서를 작성하는 사용 사례를 살펴보겠습니다. 특정 이벤트를 사용하여 입력 필드에 대한 유효성 검사를 하는 방법도 보여줍니다.


구현이 끝나면 아래와 같이 제품 정보와 함께 구매자 및 판매자 데이터로 구성된 최종 출력 양식이 표시됩니다.


매매 계약서


사용 사례를 구현하기 위해 블로그를 아래와 같이 세 가지 주요 단계로 구분했습니다.

  1. Windows Form Designer를 사용하여 레이아웃 만들기

  2. C1InputPanel 컨트롤을 데이터 소스에 바인딩

  3. 입력 컴포넌트에 유효성 검사 추가



Windows Form Designer를 사용하여 레이아웃 만들기


ComponentOne C1InputPanel은 Windows Forms 기반 컨트롤입니다. C1InputPanel 컨트롤을 사용하려면 먼저 Windows Forms 응용 프로그램을 만들고 아래와 같이 디자이너의 InputGridPanel 요소 컬렉션을 사용하여 판매 양식을 디자인해야 합니다.


1. 새 WindowsForms 응용 프로그램 생성 및 InputPanel 컨트롤 추가


ComponentOne WinForms 제품군을 시스템에 설치한 경우 도구 상자에서 C1InputPanel 컨트롤을 확인해야 합니다. 그런 다음 C1InputPanel 컨트롤을 Visual Studio 도구 상자에서 윈도 양식으로 끌어올 수 있습니다.


ComponentOne 제품이 시스템에 설치되지 않은 경우 NuGet Package Manager에서 다음 패키지를 추가하여 도구 상자에 컨트롤이 포함되도록 해야 합니다.


도구 상자



2. InputGridPanel 레이아웃 추가


InputGridPanel 컴포넌트를 C1InputPanel 컨트롤에 추가하려면 컨트롤의 오른쪽 상단에 있는 스마트 버튼 메뉴 아래의 새 항목 추가 옵션을 사용합니다.

그리드


속성 창에서 C1InputPanel의 항목 속성에 있는 줄임표를 클릭하여 C1InputPanel 항목 컬렉션 편집기를 열 수도 있습니다.


입력


3. InputGridPanel 레이아웃에 항목 추가


다음 단계는 InputGridPanel 레이아웃에 항목을 추가하여 디자인 타임에 항목 컬렉션 편집기를 통해 데이터를 입력하는 것입니다. 이 컬렉션 편집기를 사용하여 InputGridPanel 레이아웃에서 요소를 추가하거나 제거 또는 편집할 수 있습니다.


InputGridPanel 항목 컬렉션 편집기를 실행하려면 양식에서 InputGridPanel 레이아웃을 선택하고 속성 창의 요소 옆에 있는 줄임표를 클릭합니다.


추가


ColumnIndex, ColumnSpan, RowIndex, RowSpan 등의 속성을 설정하여 판매자 섹션을 디자인하는 방법을 보려면 다음 GIF를 확인하세요. 구매자 섹션에서도 동일하게 작업할 수 있습니다.


판매자


정보 섹션의 경우에는 아래 GIF를 참조하세요.


정보



C1InputPanel 컨트롤을 데이터 소스에 바인딩


InputGridPanel에 다양한 컴포넌트를 추가했으며, 필요에 따라 각 컴포넌트에 데이터를 바인딩해야 합니다. 이것은 데이터 소스에서 또는 프로그래밍 방식으로 디자인 타임에 수행할 수 있습니다. 이 데모에서는 다음과 같이 프로그래밍 방식으로 구현하겠습니다.


1. 데이터 구조화를 위해 사용자 정의 클래스 만들기


SaleInfo 클래스와 Transactor 구조를 만들어 적절한 속성을 가진 입력 컨트롤을 바인딩합니다. 데이터 파일의 모습은 다음과 같습니다.

class SaleInfo
{
public DateTime DateSold { get; set; }
public Transactor Seller { get; set; }
public Transactor Buyer { get; set; }
public string ItemsInfo { get; set; }
public int ItemsValue { get; set; }
public string FormOfPayment { get; set; }
public SaleInfo(DateTime dateS, Transactor s, Transactor b, string itemsInfo, int itemsValue, string formPayment)
{
DateSold = dateS;
Seller = s;
Buyer = b;
ItemsInfo = itemsInfo;
ItemsValue = itemsValue;
FormOfPayment = formPayment;
}
​
}
struct Transactor
{
public string PrintedName { get; set; }
public string Address { get; set; }
public string City { get; set; }
public string State { get; set; }
public string Zip { get; set; }
public string HomePhone { get; set; }
public string CellPhone { get; set; }
public string Work { get; set; }
public DateTime DateSign { get; set; }    
public Image Signature { get; set; }
​
pulic Transactor(string printName, string adress, string city, string state, string zip,string homePhone, string cellPhone, string work, DateTime dateSign, Image sign)
{
​
          PrintedName = printName;
          Address = adress;
          City = city;
          State = state;
          Zip = zip;
          HomePhone = homePhone;
          CellPhone = cellPhone;
          Work = work;
          DateSign = dateSign;
          Signature = sign;
      }
}



2. BindingSource 컴포넌트를 추가하여 데이터 로드


윈도 양식에서 VS 도구 상자를 사용하여 BindingSource 컴포넌트를 추가하고 DataSource 속성을 SaleInfo 클래스로 설정합니다.


바인드



3. BindingSource를 데이터 소스로 할당


BindingSource를 각 입력 컨트롤의 DataSource로 설정하고 DataField 속성에 적절한 값을 할당합니다.


데이터



4. BindingList를 통해 데이터 로드


각 입력 컨트롤을 데이터 소스에 바인딩했으므로 이제는 컨트롤에서 데이터를 만들고 채워야 합니다. SalesInfo 클래스의 BindingList를 만들고 Transactor 구조를 사용하여 판매자 및 구매자 데이터를 여기에 추가해야 합니다.


마지막으로 BindingList의 추가된 요소를 BindingSource 컴포넌트의 데이터 소스로 할당합니다.

Image sellerSign = Image.FromFile(@"..\..\Alic.png");
Image buyerSign = Image.FromFile(@"..\..\Bob.png");
​
BindingList<SaleInfo> datalist = new BindingList<SaleInfo>();
Transactor t1 = new Transactor("Alice Smit", "566 Swick Hill Street", "Metairie", "Louisiana", "700001", "2452194", "9999888812", "Hubspot Pvt Ltd", new DateTime(2021,11,6),sellerSign);          
Transactor t2 = new Transactor("Bob Bill", "4236 Benedum Drive", "Slate Hill", "New York", "100973", "239457", "9999888102", "SalesLoft Pvt Ltd", new DateTime(2021,11,2),buyerSign);
datalist.Add(new SaleInfo(new DateTime(2021,11,6), t1, t2, "This Canon Camera gives you the freedom to explore different ways to shoot subjects. It packs a multitude of shooting options which you can incorporate in still images to create art that embodies the exact mood and vision you are going for. Don’t worry about the lighting conditions of a place because this camera’s large-sized sensor is designed to capture picture-perfect shots even in a dimly lit environment. Thanks to its Wi-Fi connectivity and NFC paring options, sharing photos is as simple as it gets.",
              300, "cash"));
billOfSaleBindingSource.DataSource = datalist[0];
sellerSignature.Image = t1.Signature;
buyerSignature.Image = t2.Signature;


참고: 디자인 타임에 데이터로 C1InputPanel을 바인딩하는 방법에 대한 자세한 내용은 DataBinding 주제를 참조하세요.



입력 컴포넌트에 유효성 검사 추가


이 단계에서는 C1InputPanel 컨트롤의 Validating 및 KeyDown 이벤트를 사용한 유효성 검사를 통해 사용자가 유효한 항목을 입력하는지 확인하거나 유효한 항목을 채울 때까지 다른 입력으로 이동하지 못하도록 해보겠습니다.


//Validation on String Input
sellerPrintedName.Validating += stringValidating;
sellerAddress.Validating += stringValidating;
sellerCity.Validating += stringValidating;
sellerState.Validating += stringValidating;
sellerWork.Validating += stringValidating;
buyerPrintedName.Validating += stringValidating;
buyerAddress.Validating += stringValidating;
buyerCity.Validating += stringValidating;
buyerState.Validating += stringValidating;
buyerWork.Validating += stringValidating;
​
​
//Validation on Home Phone
sellerHomePhone.KeyDown += OnHomePhoneKeyDown;
buyerHomePhone.KeyDown += OnHomePhoneKeyDown;
sellerHomePhone.Validating += OnHomePhoneValidating;
buyerHomePhone.Validating += OnHomePhoneValidating;
​
//Validation on Cell Phone
sellerCellPhone.KeyDown += OnCellPhoneKeyDown;
buyerCellPhone.KeyDown += OnCellPhoneKeyDown;
sellerCellPhone.Validating += OnCellPhoneValidating;
buyerCellPhone.Validating += OnCellPhoneValidating;
​
//validation on Zip Code
sellerZip.KeyDown += OnZipKeyDown;
buyerZip.KeyDown += OnZipKeyDown;
sellerZip.Validating += OnZipValidating;
buyerZip.Validating += OnZipValidating;
​
//validation on Item Description
itemsInfo.Validating += OnItemsInfoValidating;
​
//upload Image
sellerSignature.Click += OnSignatureClick;
buyerSignature.Click += OnSignatureClick;
​
​
private void OnSignatureClick(object sender, EventArgs e)
{
InputImage control = sender as InputImage;
// open file dialog
OpenFileDialog open = new OpenFileDialog();
// image filters
open.Filter = "Image Files(*.jpg; *.jpeg; *.gif; *.bmp)|*.jpg; *.jpeg; *.gif; *.bmp";
if (open.ShowDialog() == DialogResult.OK)
{
// display image in picture box
control.Image = new Bitmap(open.FileName);
}
}
​
private void OnItemsInfoValidating(object sender, CancelEventArgs e)
{
RichTextBoxHost control = sender as RichTextBoxHost;
if (String.IsNullOrWhiteSpace(control.Text))
{
control.ErrorText = Properties.Resources.ItemDescription;
e.Cancel = true;
}
else
{
control.ErrorText = string.Empty;
}
}
​
private void OnZipValidating(object sender, CancelEventArgs e)
{
InputTextBox control = sender as InputTextBox;
if (String.IsNullOrWhiteSpace(control.Text) || control.Text.Length != 6)
{
control.ErrorText = Properties.Resources.Zip;
e.Cancel = true;
}
else
{
control.ErrorText = string.Empty;
}
}
​
private void OnZipKeyDown(object sender, KeyEventArgs e)
{
InputTextBox control = sender as InputTextBox;
if ((e.KeyValue >= 48 && e.KeyValue <= 57) || e.KeyValue == 8 || e.KeyCode == Keys.Delete || e.KeyCode == Keys.Left || e.KeyCode == Keys.Right)
{
if (control.Text.Length == 6)
{
if ((e.KeyValue >= 48 && e.KeyValue <= 57))
e.SuppressKeyPress = true;
}
}
else
{
e.SuppressKeyPress = true;
}
}
​
private void OnCellPhoneValidating(object sender, CancelEventArgs e)
{
InputTextBox control = sender as InputTextBox;
if (String.IsNullOrWhiteSpace(control.Text) || control.Text.Length != 10)
{
control.ErrorText = Properties.Resources.CellPhone;
e.Cancel = true;
}
else
{
control.ErrorText = string.Empty;
}
}
​
private void OnCellPhoneKeyDown(object sender, KeyEventArgs e)
{
InputTextBox control = sender as InputTextBox;
if ((e.KeyValue >= 48 && e.KeyValue <= 57) || e.KeyValue == 8 || e.KeyCode == Keys.Delete || e.KeyCode == Keys.Left || e.KeyCode == Keys.Right)
{
if (control.Text.Length == 10)
{
if ((e.KeyValue >= 48 && e.KeyValue <= 57))
e.SuppressKeyPress = true;
}
}
else
{
e.SuppressKeyPress = true;
}
}
​
private void OnHomePhoneKeyDown(object sender, KeyEventArgs e)
{
InputTextBox control = sender as InputTextBox;
if ((e.KeyValue >=48 && e.KeyValue <= 57) || e.KeyValue== 8 || e.KeyCode== Keys.Delete ||e.KeyCode ==Keys.Left ||e.KeyCode==Keys.Right)
{
if (control.Text.Length == 7)
{
if ((e.KeyValue >= 48 && e.KeyValue <= 57))
e.SuppressKeyPress = true;
}
}
else
{
e.SuppressKeyPress = true;
}
}
​
private void OnHomePhoneValidating(object sender, CancelEventArgs e)
{
InputTextBox control = sender as InputTextBox;
if (String.IsNullOrWhiteSpace(control.Text) || control.Text.Length !=7)
{
control.ErrorText = Properties.Resources.HomePhone;
e.Cancel = true;
}
else
{
control.ErrorText = string.Empty;
}
}
​
private void stringValidating(object sender, CancelEventArgs e)
{
InputTextBox control = sender as InputTextBox;
if (String.IsNullOrWhiteSpace(control.Text))
{
control.ErrorText = Properties.Resources.EmptyValue;
e.Cancel = true;
}
else
{
control.ErrorText = string.Empty;
}
}



컬러 UI를 만들기 위해 C1ThemeController를 사용하여 응용 프로그램에 다양한 Office2016 테마를 적용할 수 있는 옵션을 추가했습니다. 다음 코드 조각은 런타임에 테마를 변경하는 방법을 구현한 것입니다.

private void InitThemes()
{
var themes = C1ThemeController.GetThemes().Where(x => x.Contains("Office2016"));
foreach (var theme in themes)
cmbTheme.Items.Add(theme);
​
cmbTheme.SelectedIndex = 1;
}
​
private void cmbTheme_SelectedIndexChanged(object sender, EventArgs e)
{
c1ThemeController1.Theme = cmbTheme.SelectedItem.Text;
}


참고: C1ThemeController에 대한 내용은 여기에서 자세히 알아보세요.


아래와 같이 제품 정보와 함께 구매자 및 판매자 데이터로 구성된 최종 출력 양식이 표시됩니다.

최종


C1 WinForms 제품군을 설치한 경우에는 시스템의 다음 위치에서 샘플을 찾을 수 있습니다.


  • .NET 6.0 컨트롤: C:\Users\UserName\Documents\ComponentOne Samples\WinForms\v6.0\InputPanel\CS\InputPanelExplorer
  • .NET 4.5.2 컨트롤: C:\Users\UserName\Documents\ComponentOne Samples\WinForms\v4.5.2\InputPanel\CS\BillOfSale


Github 링크에서 위에서 만든 샘플을 다운로드할 수도 있습니다.

.NET 6.0 샘플 | .NET 4.5.2 샘플




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

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

댓글목록

등록된 댓글이 없습니다.

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

태그1

인기글

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