Future Of DotNet

마감 화면 작업 진행합니다. 1. 마감 화면 작업 Deadline.xaml * DatePicker를 이용해서 마감일(DeadlineDatetime)을 변경해서 조회할 수 있도록 만들었습니다. * CurrentOrders가 현재 마감일 데이터의 목록입니다. DeadlineViewModel.cs using Prism.Commands; using Prism.Ioc; using Prism.Regions; using PrismKiosk.Models; using System; using System.Collections.Generic; using System.Linq; using System.Threading.Tasks; using System.Windows; using System.Windows.Input; na..

관리자 로그인 화면 작업 합니다. 하나의 윈도우에서 왼쪽이 고객이 메뉴를 선택하는 화면이고, 오른쪽이 기계 뒷쪽에 표시되는 관리자 로그인 화면입니다. 모니터의 해상도를 어떻게 처리하는 것인지는 정확하게 모르지만, 이렇게 사용한다고 하네요 1. 관리자 로그인 작업 ManagerLogin.xaml * 아이디와 패스워드를 뷰모델에 전달해서 확인 후에 처리합니다. * PasswordBox의 Password 프로퍼티는 Binding을 사용할 수 없습니다. 왜냐하면, 비밀번호를 바인딩으로 받아서 사용하게되면, 메모리에 비밀번호가 노출되기 때문입니다. 그래서, SecureString을 이용하는 것을 권장합니다. 자세한 PasswordBox에 대한 설명은 여기를 참고하시기 바랍니다. * 이 포스트에서는 간단하게 Pas..

결제 화면 작업합니다. 1. 결재 화면 수정 Payment.xaml * 금액 출력 부분이 수정되어서 Order.cs 파일에 2개의 프로퍼티 추가 했습니다. Order.cs private int _totalAmount; /// /// 총 금액 /// public int TotalAmount { get { return _totalAmount; } set { SetProperty(ref _totalAmount, value, () => RaisePropertyChanged(nameof(Change))); } } private int _receivedAmount; /// /// 받은 금액 /// public int ReceivedAmount { get { return _receivedAmount; } set { ..

메뉴 화면에서 이전, 다음 버튼을 눌러서 상품 목록 페이징하는 작업, 동일 상품 선택시 주문 수량 추가, 금액 업데이트 방법 변경을 작업합니다. 1. 이전, 다음 상품 목록 출력 이전 버튼 커맨드와 다음 버튼 커맨드를 변경하고, 버튼 클릭시 이전, 다음 상품목록을 출력합니다. SelectMenu.xaml SelectMenuViewModel.cs /// /// 한 페이지에 노출할 상품 수 /// private const int _pageSize = 4; private int _currentPage; /// /// 현재 페이지 인덱스 /// public int CurrentPage { get { return _currentPage; } set { SetProperty(ref _currentPage, valu..

메뉴를 선택해서 주문 목록체 추가하는 부분을 작업합니다. 1. SelectMenu.xaml 상품을 선택하면 뷰모델에 커맨드를 실행해서 주문을 추가해야 합니다. 1-1. EventTrigger를 이용해서 MouseDown 이벤트가 발생하면 InvokeCommandAction을 이용해서 뷰모델에 커맨드를 실행합니다. 1-2. 위의 코드는 DataTemplate에 내부에 있기 때문에, ViewModel을 찾기 위해서는 RelativeSource를 이용해야 합니다. * RelativeSource AncestorType=ItemsControl : 현재 VisualTree 위치에서부터 위로 올라가면서 처음 만나는 ItemsControl을 찾습니다. * Path=DataContext.SelectProductComma..

메뉴 선택 화면 작업을 시작합니다. 1. SelectMenu.xaml 상품 목록 출력을 위해 ItemsControl을 이용했습니다. ListBox는 아이템을 선택한 경우 선택된 아이템의 주위의 색을 변경하기 때문에, 아이템이 선택되어도 아무런 표시가 나지 않는 ItemsControl을 이용했습니다. ItemsControl을 이용해서 데이터를 표시하려면, ItemTemplate를 이용해야 합니다. 아이템의 배치를 2x2로 만들기 위해 WrapPanel을 이용했습니다. 하단부에 DataGrid를 이용해서 선택한 상품들의 목록을 출력합니다. 화면 중간에 이전, 다음 버튼은 상품이 여러개인 경우 페이지 이동을 위해서 추가한 버튼입니다. 완성된 버튼이 아니라 이 포스트에서는 무시합니다. TabItem의 Heade..

주문시작 화면 만들기를 시작합니다. 1. 주문 시작 화면의 기능 매장이나 포장을 선택해서 메뉴 화면으로 이동합니다. 첫화면으로 이동할 수 있습니다. 장애인 UI로 전환할 수 있습니다. 30초가 지나면 처음화면으로 이동합니다. 2. AppContext.cs 키오스크의 현재 상태(주문이나 화면 위치등의 정보)를 보관하고, 사용합니다. /// /// AppContext - 애플리케이션에서 전체적으로 유지하는 데이터 보관 /// public class AppContext : BindableBase, IAppContext { /// /// 관리자 로그인 여부 /// public bool IsLogin { get; set; } private bool _isOpenCase; /// /// 케이스 오픈 여부 /// p..

ContentControl의 Content에는 View를 생성해서 넣을 수 있습니다. 다만, ViewModel에서 View를 생성해서 바인딩하는 방식을 사용하지는 않습니다. 이렇게되면, View가 ViewModel에 종속된 모양이되어서 메모리 누수가 발생할 수 있기 때문입니다. 2가지 방법이 있는데 여기서는 Behavior를 이용하는 방법에 대해서 알아 보도록 하겠습니다. 이 셈플은 PrismStep7 프로젝트에 추가로 작업되었습니다. 1. ContentControlBehavior.cs /// /// 컨텐츠 컨트롤 비헤이비어 /// public class ContentControlBehavior : Behavior { protected override void OnAttached() { //Associa..

Intro 화면 작업을 진행합니다. 1. Intro 화면의 기능 동영상 무한 반복 재생 클릭시 주문 시작 화면으로 이동 동영상 재생은 MediaElement 컨트롤을 이용합니다. 이 컨트롤에 대한 자세한 사항은 여기를 참고합니다. 동영상은 Microsoft sample 동영상을 사용했습니다. KioskIntro.xaml EventTrigger를 이용해서 MediaElement가 Loaded될 때 Action을 실행하도록 설정했습니다. Storyboard를 만들었습니다. Storyboard에서만 사용할 수 있는 MediaTimeline을 이용해서 동영상을 반복적으로 재생하도록 만들었습니다. 반복 재생에 대한 자세한 사항은 여기를 참고하기 바랍니다. b:Interaction.Triggers와 EventTri..

1. 메인 화면 구성 아래 이미지와 같이 1개의 Window를 2개의 영역으로 분할해서 사용 합니다. Kiosk 개발을 할 때 대부분 이렇게 1개의 윈도우에 화면을 분할해서 왼쪽 영역은 고객이 사용하고, 오른쪽 영역은 관리자가 사용 한다고 합니다. 최종 실행 화면 MainWindow.xaml Prism의 Region을 이용해서 1개의 화면을 2개로 분리하도록 만들었습니다. Region에 대한 자세한 설명은 여기를 참고하시기 바랍니다. 2. KioskContentRegion 영역에 출력할 Intro 화면 생성 및 연결 Views 폴더 아래 KioskIntro라는 이름의 UserControl을 추가 합니다. ViewModels 폴더에 KioskIntroViewModel이라는 이름의 클래스를 추가합니다. Ki..