PlaceholderText는 값을 입력하지 않은 경우에 표시되는 텍스트 입니다 PlaceholderText기능은 TextBox편에서 다루었었는데요. 더 간단한 방법으로 해보려고 합니다. 그때는 포커스를 받는 순간 placeholderText가 사라졌었죠. 이번에는 UWP에서와 똑같이 포커스 받을 때가 아닌 입력하는 순간 PlaceholderText가 사라지게 하겠습니다. TextBox편에서 사용했던 파일을 그대로 가져와서 ChangePropertyAction 3개를 전부 삭제합니다. 기본값으로 placeholderTextblock의 Visibility값을 Collpsed 해줍니다. 속성트리거 추가하시고, Text속성을 선택합니다. 그리고 placeholderTextblock의 Visibility값을 V..
TextBox는 텍스트를 표시하거나 편집할 수 있는 컨트롤 입니다. 아래와 같이 만들어 보겠습니다. 빠른검색텍스트는 placeholdertext (값을 입력하지 않은 경우에 표시되는 텍스트) 입니다. UWP에선 TextBox에 기본속성으로 placeholdertext가 있지만, WPF에는 없죠. 이 기능까지 포함해보겠습니다. Style을 만들기 위해, 복사본 편집을 합니다. 기본 뼈대빼고 싹 지운상태에서 아래와 같이 설정 placeholderTextblock에 값을 지정해야하므로, 문자열 입력가능한 Tag에 바인딩 해줬습니다. 이렇게해서, 디자인은 완성되었습니다. 이제 placeholder 기능을 해보겠습니다. 기능구현을 위해 ChangePropertyAction 3개가 필요합니다. 첫번째 ChangeP..
Button은 가장 많이 쓰이는 컨트롤 입니다. 아래와 같은 버튼을 만들어 보겠습니다. 가공하는 방법은, Style과 Template 두가지가 있습니다. Style로 작업하는 모습 Template으로 작업하는 모습 단순히 만드실거면, Template으로 나중을 생각하실거면 Style로 작업하시는게 좋겠죠. 물론 Template으로 작업하시다가, Style을 추가하실수도 있습니다. 저는 Style로 작업하도록 하겠습니다. 상태에 따른 효과지정 방법도 Triggers와 VisualState 두가지가 있습니다. 하나 씩 알아보겠습니다. 버튼을 복사본 편집하면, 불필요한 것들이 많습니다. 불필요한 것들은 싹 지우고 시작~ 스타일 편집창으로 가는 방법입니다. 상단메뉴를 이용하는 방법은 Style편에 있으니 아실거..
LaunchUriOrFileAction은 웹사이트를 열거나 응용 프로그램을 시작 할 수 있습니다. 시나리오 : Open버튼으로 지정한 웹사이트를 오픈 자산을 클릭하거나 단축키(Ctrl+.)를 사용하시면 확장리스트가 나오구요. LaunchUriOrFileAction을 드래그 하여 사용할 컨트롤에 안착시킵니다. 화면은 버튼하나에 LaunchUriOrFileAction이 달려있는 상태이며, 이벤트 발생은 클릭으로하고, 열릴 웹사이트 경로를 지정하였습니다. 실행 후, Open버튼 클릭하시면 제가 지정해둔 경로의 웹사이트가 열릴 것입니다.
RemoveElementAction은 대상요소를 제거 할 수 있습니다. 시나리오 : Open버튼으로 대상을 생성, RemoveElementAction으로 대상을 제거 자산을 클릭하거나 단축키(Ctrl+.)를 사용하시면 확장리스트가 나오구요. RemoveElementAction을 드래그 하여 사용할 컨트롤에 안착시킵니다. 화면은 MainWindow와 CommonPopup이 있으며, 구성은 아래와 같습니다. Open버튼으로 대상(CommonPopup)을 생성해야하는데, CS코드가 필요합니다. openButton 클릭했을 때, mainGrid에 대상을 추가하는 내용입니다. 제거해야 할 대상이 CommonPopup.xaml이므로, 이벤트를 받을 closeBorder에 RemoveElementAction을 달고 ..
MouseDragElementBehavior는 선택한 요소에 대해서 끌기기능이 가능합니다. 단, MouseClick이벤트를 처리하는 모든 컨트롤 (예:Button, TextBox 및 ListBox)에서는 동작하지 않습니다. 그렇지만, 굳이 해야한다면 할 수 있긴 합니다. 하나 씩 알아보도록 하죠. 자산을 클릭하거나 단축키(Ctrl+.)를 사용하시면 확장리스트가 나오구요. MouseDragElementBehavior을 드래그 하여 사용할 컨트롤에 안착시킵니다. 화면은 Window에 Rectabgle만 덩그러니 있는 상태에서 , MouseDragElementBehavior를 달아주었으며, 그 세부속성이 보이고 있습니다. ConstrainToParentBounds : 체크하면 부모 컨테이너의 경계를 벗어날수 ..
InvokeCommandAction은 호출될 때 지정된 ICommand를 실행합니다. 시나리오: 버튼을 클릭했을 때, 메세지박스가 버튼의 이름을 갖고 호출 자산을 클릭하거나 단축키(Ctrl+.)를 사용하시면 확장리스트가 나오구요. InvokeCommandAction을 드래그 하여 사용할 컨트롤에 안착시킵니다. 화면은 Window에 버튼 2개만 있는 상태에서 ,InvokeCommandAction을 달아주었으며, 그 세부속성이 보이고 있습니다. Command : 호출할 ICommand를 가져오거나 설정 CommandName : 호출할 ICommand 이름을 가져오거나 설정 CommandParameter : ICommand의 Execute 메서드로 전달되는 개체를 가져오거나 설정 지정된 ICommand를 만들..
FluidMoveSetTagBehavior 동작을 사용하여 데이터 저장소에 정보를 쓸 수 있으며, 이를 통해 FluidMoveSetTagBehavior 동작을 적용한 개체와의 시각적 관계 및 데이터 관계를 모두 공유하는 개체에 FluidMoveBehavior 동작을 적용할 수 있습니다. 왼쪽엔 ListBox가 오른쪽엔 ListBox에서 선택된 아이템이 나타나는 시나리오입니다. LayoutRoot를 컬럼을 나누고, 오른쪽엔 선택된 아이템을 보여줄 그리드가 있습니다. 데이터탭으로 가셔서 세부정보모드(마우스포인터)로 변경 후 Property1을 그리드에 드래그드롭하시면, Text가 나타나게 되며, (Property2도 같은방법으로 해주세요) Grid의 DataContext는 {Binding SelectedIt..
FluidMoveBehavior는 요소의 위치가 변경되는 것을 애니메이션으로 보여줍니다. 자산을 클릭하거나 단축키(Ctrl+.)를 사용하시면 확장리스트가 나오구요. FluidMoveBehavior을 드래그 하여 사용할 컨트롤에 안착시킵니다. 화면구성은 WrapPanel시간에 했던 것과 같죠. 단지, FluidMoveBehavior를 WrapPnael에 안착시켰을 뿐입니다. FluidMoveBehavior 안착시키고, 바로 실행하신 후 창크기 조절해보시면 이전과 달라진게 없을 겁니다. AppliesTo를 Children으로 바꿔주신 후, 실행하시면 변경 된 위치에 대해 1초동안 애니메이션으로 보여줍니다. 만약, AppliesTo를 Self로 확인하고 싶으시면, RectAngle에 달면 되겠습니다. 그럼 세..
ControlStoryboardAction은 만들어져있는 StoryBoard를 제어합니다. StoryboardCompletedTrigger는 StoryBoard 완료시 설정된 작업을 수행합니다. 자산을 클릭하거나 단축키(Ctrl+.)를 사용하시면 확장리스트가 나오구요. ControlStoryboardAction을 드래그 하여 사용할 컨트롤에 안착시킵니다. 아래와 같이 Button에 안착시켰으나, StoryBoard가 없죠. 새로만들기로 이름을 지정해 줍니다. StoryBoard를 만들면 자동으로 Loaded 이벤트 트리거가 만들어집니다. 이벤트 트리거는 삭제해주세요. 애니메이션은 1초동안 rectangle 180도 회전하며 색을 바꾸게 설정해놓았습니다. 스토리보드도 만들어졌으니, 스토리보드 지정 후, 실..