다음을 통해 공유


실습 정보: 사각형이 아닌 창 만들기

이 페이지는 WPF 프로젝트에만 적용됨

Microsoft Expression Blend 응용 프로그램에서는 경우에 따라 런타임에 사각형이 아닌 도형으로 시각적 모양이 변경되는 창을 만들 수 있습니다. 이런 경우에 대한 일반적인 예는 데스크톱 애플릿, 위젯 및 미디어 플레이어에서 볼 수 있습니다. 응용 프로그램의 Window 요소에 대한 몇 가지 속성을 변경한 다음 제목 표시줄 없이 창을 이동할 수 있도록 하는 이벤트 처리기 메서드를 만들어 사각형이 아닌 창을 만들 수 있습니다.

사각형이 아닌 창을 투명하게 만들기

  1. 파일 메뉴에서 새 항목을 클릭하여 Window1.xaml이라는 새로운 창 문서를 만듭니다. Window1.xaml에 대해 일치하는 코드 숨김 파일을 생성하려면 새 항목 추가 창에서 코드 파일 포함 확인란을 선택해야 합니다.

  2. 인터랙션 패널의 개체및타임라인에서 Window 요소를 선택한 다음 속성 패널의 모양에서 WindowStyle 속성을 None으로 변경하여 창 셸(제목 표시줄)을 제거합니다. F5 키를 눌러 기본 셸이 없는 창의 모양을 확인합니다. 표준 최소화, 최대화, 복원 또는 닫기 단추가 더 이상 표시되지 않습니다. 창을 더 이상 끌 수도 없습니다. Alt+F4를 눌러 창을 닫습니다.

    [!참고]

    다른 WindowStyle 옵션에 대한 자세한 내용은 MSDN에서 WPF 창 개요 항목을 참조하십시오.

  3. 속성 패널의 모양에서 AllowsTransparency 확인란을 선택합니다. 이제 창 테두리가 더 이상 표시되지 않습니다.

  4. 창에 투명성을 추가하려면 속성 패널의 브러시에서 Window 요소의 Background 속성을 브러시 없음Cc295119.706bbd5c-c0e0-43a1-9604-297f019d0275(ko-kr,Expression.10).png으로 설정할 수 있습니다. 또한 사용자가 표시되지 않는 창 영역을 클릭할 수 있도록 하려면 Background 속성을 단색 브러시Cc295119.3a66ec96-47bb-47fc-8876-6b9456feec3a(ko-kr,Expression.10).png로 설정한 다음 배경 브러시의 알파 속성을 1로 설정합니다. 이렇게 하면 창의 클릭 가능한 영역이 표시되지는 않지만 해당 영역을 계속 클릭할 수 있습니다.

  5. 마지막으로 개체 및 타임라인에서 LayoutRoot를 두 번 클릭하여 요소를 활성화한 다음 도구 상자에서 요소를 아트보드에 추가합니다. 요소에 대해 OpacityMask 브러시를 설정하여 다양한 효과를 만들 수 있습니다. 이 작업을 수행하는 방법에 대한 자세한 내용은 불투명 마스크 만들기를 참조하십시오. 또한 타원Cc295119.8938cfdf-9b75-4a33-bc88-b0636e114a0d(ko-kr,Expression.10).pngCc295119.894f8612-e0ed-4e00-84cf-a9bc8f38fc54(ko-kr,Expression.10).png과 같은 그리기 도구를 사용하여 도형 및 그린 패스를 추가한 다음 다른 요소 뒤에 있는 요소를 이동(요소를 마우스 오른쪽 단추로 클릭한 다음 순서 지정을 클릭)할 수 있습니다. LayoutRoot의 콘텐츠는 실제로 응용 프로그램의 윤곽선을 정의합니다.

  6. F5 키를 다시 눌러 창의 현재 모양을 확인합니다. 창을 계속 끌 수 없습니다. Alt+F4를 눌러 창을 닫습니다.

런타임에 창을 끌 수 있도록 하는 코드 추가

창을 투명하게 만들면 실제로는 제목 표시줄 없는 창의 위치를 변경하는 기능이 손실됩니다. 창을 다시 이동할 수 있도록 만들려면 창에 이벤트 처리기를 추가한 다음 관련된 코드 숨김 파일에 약간의 코드를 추가해야 합니다.

  1. 파일 메뉴에서 모두 저장을 클릭하여 하드 디스크에 프로젝트를 저장합니다. 저장되지 않은 프로젝트에는 이벤트 처리기 메서드를 추가할 수 없습니다.

  2. 개체 및 타임라인에서 Window 요소를 선택하고 속성 패널에서 이벤트 단추 Cc295119.6c67bb3b-e8a2-4a63-bad5-54d5c15b04dd(ko-kr,Expression.10).png를 클릭합니다.

  3. MouseLeftButtonDown 옆에 OnMouseLeftButtonDown을 입력한 다음 Enter 키를 누릅니다.

    • Microsoft Visual Studio 2008 Standard Edition 이상이 설치되어 있는 경우에는 Enter 키를 누른 후 생성되는 이벤트 처리기 코드가 코드 숨김 파일(Window1.xaml.cs)에 자동으로 추가되고 코드 숨김 파일이 열려 Visual Studio에서 편집할 수 있습니다.

    • Visual Studio가 설치되어 있지 않은 경우에는 이벤트 처리기 메서드에 대한 코드가 클립보드에 복사되어 코드 숨김 파일에 붙여 넣을 수 있습니다. 프로젝트 패널에서 코드 숨김 파일을 두 번 클릭하여 엽니다. 코드 숨김 파일의 마지막에서 두 번째 닫는 괄호(코드 숨김 파일에서 C#을 사용하는 경우) 바로 앞이나 End Class 문(코드 숨김 파일에서 VB. NET을 사용하는 경우) 바로 앞에 생성된 이벤트 처리기 메서드 코드를 붙여 넣습니다.

      [!참고]

      Expression Blend의 프로젝트 패널에서 코드 숨김 파일을 두 번 클릭하여 열 수 없으면 코드 숨김 파일의 파일 확장명(.cs 또는 .vb)과 관련된 응용 프로그램이 없는 경우이므로 Windows에서 파일 여는 방법을 알 수 없습니다. 메모장과 같은 편집기와 .cs 및 .vb 파일을 연결하는 방법에 대한 자세한 내용은 코드 숨김 파일 편집을 참조하십시오.

  4. 이벤트 처리기가 다음과 같이 나타나도록 코드 숨김 파일에서 생성된 이벤트 처리기 메서드를 수정합니다.

    private void OnMouseLeftButtonDown(object sender,
             System.Windows.Input.MouseButtonEventArgs e)
    {
      this.DragMove();
    }
    
    Private Sub OnMouseLeftButtonDown(ByVal sender As System.Object,
             ByVal e As System.Windows.Input.MouseButtonEventArgs)
      Me.DragMove()
    End Sub
    
  5. F5 키를 눌러 응용 프로그램을 실행합니다.

  6. 코드 숨김 파일에서 Close() 메서드를 호출할 단추의 Click 이벤트에 대한 메서드처럼 이벤트 처리기 메서드를 더 추가할 수 있습니다. 이벤트 처리기 메서드를 만드는 방법에 대한 자세한 내용은 이벤트 처리 개요를 참조하십시오.