[WPF] 공공데이터 포털 API 이용 클라이언트 구현 Part 3

-
이미지
그룹핑 ListViewItem 그룹핑 할 수 있습니다. 먼저 CheckBox에 Checked 이벤트를 통해 그룹핑을 추가하고 RemoveChecked 이벤트를 통해 그룹핑을 제거 할 수 있도록 CheckBox를 선언 합니다. 1: <!-- Group CheckBox --> 2: <CheckBox Grid.Column="0" 3: Grid.Row="0" 4: Checked="AddGrouping" 5: Unchecked="RemoveGrouping">Group by Name</CheckBox> 그룹 스타일 선언 GroupStyle 속성에 ContainerStyle 속성을 이용해 Style을 지정 합니다. Expander 컨트롤을 이용해 아파트명과 그룹 아이템의 개수를 Expander Header에 표시 하도록 ControlTemlate를 선언 합니다. 1: <!-- Group Style --> 2: <ListView.GroupStyle> 3: <GroupStyle> 4: <GroupStyle.ContainerStyle> 5: <Style TargetType="{x:Type GroupItem}"> 6: <Setter Property="Margin" Value="0,0,0,5" /> 7: <Setter Property="Te...
댓글 3개

WPF Layout를 이용한 회원 가입 윈도우 만들기

-

오늘은 WPF의 Layout 기능을 이용한 어플 시작 페이지를 만들어 보고자 합니다.

결과물 부터 확인 해 보겠습니다.

계정 만들기

초기 비어 있는 유저 사진 공간을 채울 이미지를 제외 하고는 WPF의 Layout 기능만 가지고 구현 할 수 있습니다.

이 Layout은 상위부터 하위까지 각 로우 별로 하나의 엘레멘트를 가지고 있는 구조이기에 저는 StackPanel을 이용해 구현 하였습니다.

그럼 XAML 코드를 한번 볼까요?

StackPanel 태그를 선언 합니다.

StackPanel에 Margin을 적당하게 설정 합니다.
1:  <Window x:Class="WunderlistDoIt.RegisterWindow"  
2:      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
3:      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
4:      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"  
5:      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"  
6:      xmlns:local="clr-namespace:WunderlistDoIt"  
7:      mc:Ignorable="d"  
8:      Title="RegisterWindow"   
9:      Height="650"   
10:      Width="450">  
11:    <StackPanel Margin="10">      
12:    </StackPanel>  
13:  </Window>

사용자 이미지 버튼을 생성 합니다.

사용자가 마우스를 클리하여 이미지를 선택 할 수 있어야 하기에 Button 태그를 선언하며, 사용자 이미지를 Button에 표현하기 위해 Content 속성에 Image 태그를 설정 합니다.
1:  <!-- Button -->  
2:  <Button Name="btnUserImage" Margin="160,60,160,50">  
3:    <Button.Content>  
4:      <Image Source="Images/unknown_user.PNG" Stretch="Fill" />  
5:    </Button.Content>  
6:  </Button>

안내 문구를 생성 합니다.

안내 문구를 표현을 위해 필요한 TextBlock 속성을 설정 합니다.
1:  <!-- Text -->  
2:  <TextBlock FontWeight="Bold"   
3:            FontSize="22"   
4:            HorizontalAlignment="Center"  
5:            Text="무료 계정 만들기" />  
6:  <!-- Text -->  
7:  <TextBlock Margin="20,5,20,0"  
8:            FontSize="14"   
9:            Foreground="#CCCCCC"  
10:            HorizontalAlignment="Center"  
11:            TextWrapping="Wrap"  
12:            Text="계정을 만들면 모든 장치에서 목록을 동기화하고 친" />  
13:  <TextBlock Margin="20,0,20,20"  
14:            FontSize="14"   
15:            Foreground="#CCCCCC"  
16:            HorizontalAlignment="Center"   
17:            Text="구와 공유할 수 있습니다." />

사용자가 정보 관련 TextBox를 생성 합니다.

사용자의 이름, 이메일, 비밀번호를 입력 받을 수 있는 TextBox 태그를 선언하고 Layout 관련된 속성을 적당히 설정 합니다.
1:  <!-- Name TextBox -->  
2:  <TextBox Name="txtName"  
3:           Margin="15,5,15,5"  
4:           Height="40"  
5:           BorderBrush="#CCCCCC"></TextBox>  
6:  <!-- Email TextBox -->  
7:  <TextBox Name="txtEmail"  
8:           Margin="15,5,15,5"  
9:           Height="40"  
10:           BorderBrush="#CCCCCC"></TextBox>  
11:  <!-- Password TextBox -->  
12:  <TextBox Name="txtPasword"  
13:           Margin="15,5,15,5"  
14:           Height="40"  
15:           BorderBrush="#CCCCCC"></TextBox>

회원 가입 버튼을 생성 합니다.

Button 태그를 이용해 버튼을 생성 하고, 배경색을 바꾸기 위해 Backgound 속성에 변경하고자 하는 RGB값을 넣습니다. 버튼은 기본으로 Border 속성 값이 설정 되어 있지만, 이번에 필요가 없으 BorderThickness 속성을 0으로 설정 합니다. 그 외에 필요한 속성을 설정 합니다.
1:  <!-- Register Button -->  
2:  <Button Name="btnRegister"  
3:          Margin="15,5,15,5"  
4:          FontWeight="Bold"  
5:          FontSize="18"  
6:          Background="#2B88D9"  
7:          BorderThickness="0"  
8:          Foreground="White"  
9:          Height="40"   
10:          Content="가입하기" />

안내 문구를 생성 합니다.

TextBlock 태그를 이용해 안내 문구를 작성 합니다. 밑줄이 들어간 부분은 웹 사이트 링크라는 것이므로 HyperLink 태그를 사용하도록 하고, 한 줄로 표현하기에 문장이 길어 TextBlock 태그를 2번 사용 합니다.
1:  <!-- Text -->  
2:  <TextBlock Foreground="#CCCCCC"  
3:            FontSize="14"  
4:            Margin="30,30,30,0"  
5:            HorizontalAlignment="Center">  
6:        <Bold>계정을 만들면</Bold>  
7:        <Hyperlink Foreground="#CCCCCC" NavigateUri="https://naver.com" RequestNavigate="Hyperlink_RequestNavigate">이용약관</Hyperlink> 및  
8:        <Hyperlink Foreground="#CCCCCC" NavigateUri="https://naver.com" RequestNavigate="Hyperlink_RequestNavigate">개인정보취급방침</Hyperlink>에 동의하게  
9:  </TextBlock>  
10:  <TextBlock Foreground="#CCCCCC"  
11:            FontSize="14"  
12:            HorizontalAlignment="Center">  
13:        됩니다.  
14:  </TextBlock>

여기까지 StackPanel를 이용한 Layout 작업을 마무리 하겠습니다.

댓글

댓글 쓰기

이 블로그의 인기 게시물

[C#] Task 완료 시 다른 Task를 자동으로 수행

-
Task 수행 중에 Wait 메서드를 호출하거나 Result 속성을 살펴보게 되면 거의 항상 스레드 풀 내에 새로운 스레드가 생기게 되어 리소스를 많이 사용하게 되고 성능에 좋지 않은 영향을 미치게 된다. Wait 메서드나 Result 속성보다 Task가 언제 수행 완료하였는지를 확인할 수 있는 좋은 방법이 있는데, ContinueWith 메소드를 이용해 Task가 완료되었을 때 다른 Task를 수행하게 하는 방법이다. CancellationTokenSource와 Task를 생성 1: CancellationTokenSource cts = new CancellationTokenSource(); 2: Task<Int32> t = Task.Run<Int32>(() => Sum(cts.Token, 10000), cts.Token); Task 성공, 예외 발생, 취소 후 수행할 Task를 등록 1: // 작업이 성공했을 경우 실행 2: t.ContinueWith(task => Console.Write("The sum is: " + task.Result), TaskContinuationOptions.OnlyOnRanToCompletion); 3: // 작업에 예외가 발생했을 경우 실행 4: t.ContinueWith(task => { 5: foreach (var e in task.Exception.InnerExceptions) 6: { 7: if (e is OperationCanceledException) Console.WriteLine("Sum was canceled"); 8: else Console.WriteLine("Sum threw: " + task.Exception); 9: } 10: ...
자세한 내용 보기

[C#] 태스크(Task)가 완료될 때 까지 대기하여 결과를 얻는 방법

-
Task를 이용하면 Task가 완료될 때까지 대기 하였다가 결과를 얻는 것이 가능하다. 1: private static void TaskWaitSample() 2: { 3: // 태스크를 생성한다.(아직 시작하지 않았다) 4: Task<Int32> t = new Task<Int32>(n => Sum((Int32)n), 10000); 5: 6: // 태스크를 수행 7: t.Start(); 8: 9: // 필요하다면 태스크가 완료될 때까지 명시적으로 대기할 수 있다. 10: // Wait()를 호출한 쓰레드가 블러킹된다. 11: t.Wait(); // 참고: 타임아웃 시간이나 CancellationToken을 매개변수로 취하는 메서드도 있음. 12: 13: // 결과를 얻어온다 14: Console.WriteLine("The Sum is: " + t.Result); 15: } 16: 17: private static Int32 Sum(Int32 n) 18: { 19: Int32 sum = 0; 20: for(; n > 0; n--) 21: { 22: checked { sum += n; } 23: } 24: 25: return sum; 26: } Task 수행 중 예외 발생 Task가 수행 중에 처리되지 않은 예외를 유발하는 경우, 바로 예외가 발생하지 않고 특정 컬렉션에 예외를 저장 한 후, 스레드가 스레드 풀로 반납되도록 한다. 이 후 Wait 메서드를 호출하거나 Result 속성 값을 가져오려 하면 그때 System.AggregateException ...
자세한 내용 보기

[C#] 명시적으로 Task 생성 및 실행

-
이 내용은 msdn에 내용을 발췌 한 것입니다. ( https://docs.microsoft.com/ko-kr/dotnet/standard/parallel-programming/task-based-asynchronous-programming ) Task를 생성 할 때는 Task에서 실행 할 코드를 캡슐화하는 사용자 대리자를 지정해야 합니다. 대리자는: 명명된 대리자 익명 메소드 람다식 으로 표현할 수 있습니다. - Task 생성 1: static void Main(string[] args) 2: { 3: Thread.CurrentThread.Name = "Main"; 4: // lambda expression을 이용한 Task 생성 5: Task taskA = new Task(() => Console.WriteLine("Hello from taskA")); 6: // Task 시작 7: taskA.Start(); 8: // 호출 쓰레드에서 출력한 메시지 9: Console.WriteLine("Hello from thread '{0}'.", Thread.CurrentThread.Name); 10: // 응용 프로그램이 종료되기 전에 작업 실행이 완료되도록 Task.Wait 메소드에 호출 11: taskA.Wait(); 12: Console.ReadKey(); 13: } 14: // The example displays output like the following: 15: // Hello from thread 'Main'. 16: // Hello from taskA. - 한 번에 작업을 만들고 시작 1: ...
자세한 내용 보기