Share via


항목 컨트롤 그리기

항목 컨트롤에는 자식 개체 컬렉션이 들어 있는 Items 속성이 있습니다. 항목 컬렉션에 모든 형식의 자식 개체를 추가하거나 데이터 바인딩을 사용하여 데이터 원본의 항목 배열을 표시할 수 있습니다. 항목 컨트롤에는 콘텐츠(Content) 속성과 헤더(Header) 속성이 없습니다. 자식 개체는 항목 컨트롤의 항목 호스트에 추가됩니다. ListBox의 경우 항목 호스트는 항목을 세로로 정렬하는 스택 패널입니다. Microsoft Expression Blend에서 항목 컨트롤의 템플릿을 편집하지 않는 한 개체 및 타임라인 패널에 항목 호스트가 표시되지 않습니다.

다음 절차에서는 항목 컨트롤(ListBox)을 만들고 항목 컬렉션에 개체를 추가하는 방법을 설명합니다. 이 절차는 MSDN의 ItemsControl Types(ItemsControl 형식) 항목에서 "형식" 아래 나와 있는 다른 항목 컨트롤에도 사용할 수 있습니다.

데이터 원본의 항목 배열을 표시하려면 실습 정보: RSS 뉴스 수집기 만들기 항목을 참조하십시오.

자세한 내용은 StackPanel 레이아웃 패널 사용을 참조하십시오.

항목 컨트롤 만들기

  1. Expression Blend의 왼쪽에 있는 도구 패널에서 자산 Cc294882.0d8b8d29-1af9-418f-8741-be3097d76eab(KO-KR,Expression.30).png을 클릭합니다. 컨트롤 범주에서, 목록에서 ListBox Cc294882.ffd7a7c3-6bcd-4ed3-a59e-1f28d06ec4ae(KO-KR,Expression.30).png를 선택합니다. ListBox 컨트롤 아이콘이 자산 단추 아래에 나타납니다. 이제 이 아이콘을 선택하여 아트보드에 ListBox를 추가할 수 있습니다.

    Cc294882.alert_tip(KO-KR,Expression.30).gif팁:

    Button 컨트롤처럼 가장 일반적인 UI(사용자 인터페이스) 요소는 자산 단추 아래에 드롭다운 목록으로 표시되기 때문에 요소를 빠르게 추가할 수 있습니다.

  2. 아트보드에 단추를 추가하려면 도구 패널에서 ListBox 컨트롤 아이콘을 두 번 클릭합니다.

    아트보드의 기본 위치(왼쪽 위)에 기본 크기로 추가된 ListBox 개체

    Cc294882.cd6e2b8c-8640-474d-81b3-5c476113947a(KO-KR,Expression.30).png

    Cc294882.alert_tip(KO-KR,Expression.30).gif팁:

    도구 패널에서 컨트롤을 선택한 다음 아트보드를 클릭하고 마우스를 끌어 컨트롤의 경계 상자를 지정하는 방식으로 아트보드에 컨트롤을 추가할 수도 있습니다.

    Cc294882.alert_tip(KO-KR,Expression.30).gif팁:

    ListBox 컨트롤과 같은 UI 요소를 아트보드에 추가하면 응용 프로그램의 개체가 됩니다.

  3. 개체 및 타임라인 패널에서 ListBox 개체를 클릭하여 개체를 활성화합니다. 개체를 둘러싸는 노란색 강조 표시가 나타납니다. 개체를 활성화하면 자식 개체를 추가할 수 있습니다.

    Cc294882.alert_tip(KO-KR,Expression.30).gif팁:

    도구 패널에서 선택 Cc294882.2ff91340-477e-4efa-a0f7-af20851e4daa(KO-KR,Expression.30).png을 먼저 선택한 다음 아트보드에서 해당 개체를 두 번 클릭하는 방식으로 개체를 활성화할 수도 있습니다.

  4. 도구 패널에서 TextBlock Cc294882.42165963-00f7-4a33-abcd-b0849edebada(KO-KR,Expression.30).png, Button Cc294882.05df1779-a68f-436b-b834-a91b7995a3ec(KO-KR,Expression.30).png, Rectangle Cc294882.ae750268-92e8-403a-9e07-b662da4e9e1e(KO-KR,Expression.30).png 등의 개체를 사용하여 ListBox에 여러 가지 도형을 그립니다. 목록에 이들 자식 개체가 세로로 정렬되는 것을 확인할 수 있습니다.

    ListBox 개체에 추가된 자식 개체

    Cc294882.926bd9e5-e1d9-47a3-a37a-33cd351984b4(KO-KR,Expression.30).png

    [!참고]

    항목 컨트롤의 크기를 넘는 개체를 추가하면 응용 프로그램을 실행할 때 스크롤 막대가 표시되어 추가 개체를 볼 수 있도록 합니다.

    Cc294882.alert_tip(KO-KR,Expression.30).gif팁:

    개체 및 타임라인 패널에서 개체를 끌어 놓아 목록에서 개체의 순서를 바꾸거나 선택Cc294882.2ff91340-477e-4efa-a0f7-af20851e4daa(KO-KR,Expression.30).png을 선택하여 아트보드로 요소를 끌 수 있습니다.

  5. ListBox에서 항목을 확인하고 컬렉션 편집기 창에서 다른 항목을 추가할 수 있습니다. 컬렉션 편집기를 열려면 속성 패널에서 Items (컬렉션) 속성 옆에 있는 이 컬렉션의 항목 편집 Cc294882.3f9fe48b-caf8-4989-8a91-017ba1e0cb77(KO-KR,Expression.30).png을 클릭합니다.

  6. 프로젝트를 빌드(F5 키)하여 결과 응용 프로그램을 확인합니다.