스타일 선택하기

테마에서는 각 요소마다 한개 이상의 스타일을 가질 수 있습니다. 만약 요소에 대한 기본 스타일이 정의 되어 있는 경우에는 테마를 선택할 때 기본스타일이 반영이 되지만, 기본 스타일이 없거나 다른 스타일을 선택하고자 할때에는 직접 스타일을 선택하여 적용할 수 있습니다.

컬러 수정하기(Detail)

ColorWheel을 이용한 컬러 수정이 간단하게 전체적인 분위기를 바꾸는 작업이었다면, 이번에는 각각 요소에 대한 색을 디테일하게 변경해 보도록 하겠습니다. 검색 영역에 수정할 요소의 이름을 입력하면 해당 요소가 사용하는 브러시의 목록이 나타나게 되며 여기서 각 요소에 대한 디테일한 수정이 가능합니다.

세계적으로 전체 인구의 약 10%가 색맹 또는 색약을 가지고 있다고 합니다. Codinator에서는 여러분께서 선택하고 수정하신 테마가 이들에게 어떻게 보여지는지를 시뮬레이션 하고 이를 보고 색을 보정 할 수 있는 기능을 제공함으로 써 더 많은 사용자에게 편리한 UX를 제공 할 수 있도록 돕습니다.

이상으로 현재 Codinator Beta에서 제공되고 있는 기능에 대한 소개를 마치며 혹시 더 궁금하신점이나 베타 참여, 피드백, 기타 문의 사항은 언제든지 저에게 또는 service@codinator.net 으로 연락주시면 감사하겠습니다. 아직 부족한점이 많은 제품이지만 관심 가져 주셔서 감사드리며 앞으로 더 나은 제품을 만들기 위해 노력하고 끝까지 최선을 다하겠습니다. 많은 관심과 응원부탁드리겠습니다.

감사합니다!!

Create Gradient Editor Control

먼저 Linear Gradient를 표현하기 위해서 아래와 같이 기본적인 속성들을 선언합니다. 각요소를 표현하기 위해 DrawingVisual을 이용 할 예정이기 때문에 FrameworkElement를 상속받아 VisualCollection를 선언한 뒤 VisualChildrenCount와 GetVisualChild를 재정의 합니다.

이외에 몇가지 추가기능(마우스 제어 등)을 구현이 필요하지만 포스팅에 올리기에는 많은양의 소스코드라 나머지 부분에 대해서는 첨부파일을 확인 해주시기 바랍니다. 아래는 이번시간에 사용된 전체 소스코드 입니다. 기타 궁금하신점이나 문의사항은 이메일이나 댓글로 올려주시면 답변드리도록 하겠습니다.

WIT.WPF.Samples.GradientEditorSample.zip

Create DemoView(Default Data Binding)

ReverseBinding를 구현하기에 앞서 ReverseBinding을 테스트 하기 위한 상황을 만들기 위해 위와 같이 두개의 RadioButton이 있는 간단한 DemoView를 구현했습니다. 그리고 RadioButton에 ViewModel에 정의된 IsMale속성을 Binding하고, 텍스트 박스에도 IsMale 속성을 Binding합니다. 아래는 DemoView에 해당하는 소스코드입니다.

Create ReverseBinding Extension

아래는 ReverseBinding을 구현한 소스코드의 일부분으로, 요약하면 Binding객체를 파라미터로 받는 MarkupExtension을 생성하고, ProvideValueTarget을 이용해 Source Object와 Source Property를 가져온 뒤, DataContext의 Target Property에 Binding을 수행하는 과정을 나타냅니다.public ReverseBindingExtension(Binding Binding) { this.Binding = Binding; } public override object ProvideValue(IServiceProvider serviceProvider) { IProvideValueTarget ProvideValueTarget = serviceProvider.GetService(typeof(IProvideValueTarget)) as IProvideValueTarget; SourceObject = ProvideValueTarget.TargetObject as FrameworkElement; SourceProperty = ProvideValueTarget.TargetProperty as DependencyProperty; OnSetReverseBinding(SourceObject.DataContext as DependencyObject); return SourceProperty.DefaultMetadata.DefaultValue; } protected void OnSetReverseBinding(DependencyObject Target) { if (Binding == null || SourceObject == null || SourceProperty == null || Target == null) return; Type TargetType = Target.GetType(); string TargetPath = Binding.Path.Path; DependencyPropertyDescriptor Descriptor = DependencyPropertyDescriptor.FromName(TargetPath, TargetType, TargetType); DependencyProperty TargetProperty = Descriptor.DependencyProperty; string Result = XamlWriter.Save(Binding); Binding CloneBinding = XamlReader.Parse(Result) as Binding; CloneBinding.Path = new PropertyPath(SourceProperty); CloneBinding.Source = SourceObject; SourceObject.SetValue(SourceProperty, Target.GetValue(TargetProperty)); BindingOperations.SetBinding(Target, TargetProperty, CloneBinding); }
위와 같이 구현된 ReverseBinding을 이용해 실제 XAML에서 사용할 때에는 아래와 같이 사용할 수 있습니다.

아래는 이번시간에 사용된 전체소스코드입니다. 혹시 글을 읽으시고 이해가 안되시는 부분이나, 기타 문의사항은 댓글이나 이메일로 남겨주시면 답변드리도록 하겠습니다.

WIT.WPF.Sample.ReverseBindingExample.zip