LAYOUT Archives - icodebroker

[C#/WINUI3/.NET8] ListView 클래스 : ContainerContentChanging 이벤트를 사용해 컨테이너 컨텐트 변경시 처리하기

■ ListView 클래스의 ContainerContentChanging 이벤트를 사용해 컨테이너 컨텐트 변경시 처리하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서

[C#/WINUI3/.NET8] ScrollViewer 클래스 : CurrentAnchor 속성을 사용해 ItemsRepeater 객체에서 현재 앵커 항목을 구하기

■ ScrollViewer 클래스의 CurrentAnchor 속성을 사용해 ItemsRepeater 객체에서 현재 앵커 항목을 구하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj

[C#/WINUI3/.NET8] Control 클래스 : ItemsRepeater 객체를 사용해 커스텀 컬렉션 컨트롤 만들기

■ Control 클래스에서 ItemsRepeater 객체를 사용해 커스텀 컬렉션 컨트롤을 만드는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서

[C#/WINUI3/.NET8] ItemsRepeater 엘리먼트 : ItemTemplate 속성에서 DateTemplate 객체 내에 ItemsRepeater 객체를 사용해 그룹화된 항목 표시하기 2

■ ItemsRepeater 엘리먼트의 ItemTemplate 속성에서 DateTemplate 객체 내에 ItemsRepeater 객체를 사용해 그룹화된 항목을 표시하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다.

[C#/WINUI3/.NET8] UniformGridLayout 엘리먼트 : MinItemWidth/MinColumnSpacing/ItemsJustification 속성 사용하기

■ UniformGridLayout 엘리먼트의 MinItemWidth/MinColumnSpacing/ItemsJustification 속성을 사용하는 방법을 보여준다. ▶ 예제 코드 (XAML)


<ItemsRepeater Name="itemsRepeater">
    <ItemsRepeater.Layout>
        <UniformGridLayout
            MinItemWidth="200"
            MinColumnSpacing="28"
            ItemsJustification="SpaceAround" />
    </ItemsRepeater.Layout>
</ItemsRepeater>

<ItemsRepeater.Layout>

<UniformGridLayout

MinItemWidth="200"

MinColumnSpacing="28"

ItemsJustification="SpaceAround" />

</ItemsRepeater.Layout>

</ItemsRepeater>

[C#/WINUI3/.NET8] StackLayout 엘리먼트 : Orientation/Spacing 속성을 사용해 항목 배열 방향과 간격 설정하기

■ StackLayout 엘리먼트의 Orientation/Spacing 속성을 사용해 항목 배열 방향과 간격을 설정하는 방법을 보여준다. ▶ 예제 코드 (XAML)


<ItemsRepeater Name="itemsRepeater">
    <ItemsRepeater.Layout>
        <StackLayout
            Orientation="Horizontal"
            Spacing="10" />
    </ItemsRepeater.Layout>
</ItemsRepeater>

<ItemsRepeater.Layout>

<StackLayout

Orientation="Horizontal"

Spacing="10" />

</ItemsRepeater.Layout>

</ItemsRepeater>

[C#/WINUI3/.NET8] ScrollViewer 클래스 : ViewChanged 이벤트를 사용해 ItemsRepeater 객체에서 데이터 증분 로드하기

■ ScrollViewer 클래스의 ViewChanged 이벤트를 사용해 ItemsRepeater 객체에서 데이터를 증분 로드하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트

[C#/WINUI3/.NET8] TreeView 클래스 : DragItemsStarting/DragItemsCompleted/DragOver/Drop 이벤트를 사용해 트리뷰 간 노드 DRAG/DROP 처리하기

■ TreeView 클래스의 DragItemsStarting/DragItemsCompleted/DragOver/Drop 이벤트를 사용해 트리뷰 간 노드 DRAG/DROP을 처리하는 방법을 보여준다. ※ 테스트 예제이기 때문에 자식 노드를 갖고 있는 노드를

[C#/WINUI3/.NET8] TreeView 엘리먼트 : ItemTemplateSelector 속성을 사용해 사진/음악 라이브러리 파일 조회하기

■ TreeView 엘리먼트의 ItemTemplateSelector 속성을 사용해 사진/음악 라이브러리 파일을 조회하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서

[C#/WINUI3/.NET8] TreeView 엘리먼트 : ItemsSource 속성을 사용해 데이터 바인딩하기

■ TreeView 엘리먼트의 ItemsSource 속성을 사용해 데이터를 바인딩하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType 태그를

[C#/WINUI3/.NET8] TreeView 엘리먼트 : SelectionMode 속성을 사용해 복수 항목 선택하기

■ TreeView 엘리먼트의 SelectionMode 속성을 사용해 복수 항목을 선택하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType

[C#/WINUI3/.NET8] TreeView 클래스 : Expanding/Collapsed 이벤트를 사용해 동적 노드 축소/확장하기

■ TreeView 클래스의 Expanding/Collapsed 이벤트를 사용해 동적 노드 축소/확장하는 방법을 보여준다. ▶ 예제 코드 (C#)


using Microsoft.UI.Xaml.Controls;

// ...

TreeView treeView2;

// ...

treeView.Expanding += treeView_Expanding;
treeView.Collapsed += treeView_Collapsed;

// ...

#region 트리뷰 축소시 처리하기 - treeView_Collapsed(sender, e)

/// <summary>
/// 트리뷰 축소시 처리하기
/// </summary>
/// <param name="sender">이벤트 발생자</param>
/// <param name="e">이벤트 인자</param>
private void treeView_Collapsed(TreeView sender, TreeViewCollapsedEventArgs e)
{
    if(e.Node.HasUnrealizedChildren)
    {
        AddChildTreeViewNode(e.Node);
    }
}

#endregion
#region 트리뷰 확장시 처리하기 - treeView_Expanding(sender, e)

/// <summary>
/// 트리뷰 확장시 처리하기
/// </summary>
/// <param name="sender">이벤트 발생자</param>
/// <param name="e">이벤트 인자</param>
private void treeView_Expanding(TreeView sender, TreeViewExpandingEventArgs e)
{
    e.Node.Children.Clear();

    e.Node.HasUnrealizedChildren = true;
}

#endregion

#region 자식 트리뷰 노드 추가하기 - AddChildTreeViewNode(parentNode)

/// <summary>
/// 자식 트리뷰 노드 추가하기
/// </summary>
/// <param name="parentNode">부모 노드</param>
private void AddChildTreeViewNode(TreeViewNode parentNode)
{
    // 부모 노드의 자식 노드들을 추가한다.
}

#endregion

using Microsoft.UI.Xaml.Controls;

// ...

TreeView treeView2;

// ...

treeView.Expanding += treeView_Expanding;

treeView.Collapsed += treeView_Collapsed;

// ...

#region 트리뷰 축소시 처리하기 - treeView_Collapsed(sender, e)

/// <summary>

/// 트리뷰 축소시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void treeView_Collapsed(TreeView sender, TreeViewCollapsedEventArgs e)

{

if(e.Node.HasUnrealizedChildren)

{

AddChildTreeViewNode(e.Node);

}

#endregion

#region 트리뷰 확장시 처리하기 - treeView_Expanding(sender, e)

/// <summary>

/// 트리뷰 확장시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void treeView_Expanding(TreeView sender, TreeViewExpandingEventArgs e)

{

e.Node.Children.Clear();

e.Node.HasUnrealizedChildren = true;

}

#endregion

#region 자식 트리뷰 노드 추가하기 - AddChildTreeViewNode(parentNode)

/// <summary>

/// 자식 트리뷰 노드 추가하기

/// </summary>

/// <param name="parentNode">부모 노드</param>

private void AddChildTreeViewNode(TreeViewNode parentNode)

{

// 부모 노드의 자식 노드들을 추가한다.

}

#endregion

[C#/WINUI3/.NET8] TreeView 엘리먼트 : ItemContainerStyle 속성을 사용해 항목 컨테이너 스타일 설정하기

■ TreeView 엘리먼트의 ItemContainerStyle 속성을 사용해 항목 컨테이너 스타일을 설정하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서

[C#/WINUI3/.NET8] TreeView 엘리먼트 : RootNodes 속성을 사용해 TreeViewNode 객체 추가하기

■ TreeView 엘리먼트의 RootNodes 속성을 사용해 TreeViewNode 객트를 추가하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType

[C#/WINUI3/.NET8] PipsPager 엘리먼트 : PreviousButtonStyle/NextButtonStyle 속성 사용하기

■ PipsPager 엘리먼트의 PreviousButtonStyle/NextButtonStyle 속성을 사용하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType 태그를 None으로 추가했다.

[C#/WINUI3/.NET8] FlipView 엘리먼트 : ItemsPanel 속성에서 VirtualizingStackPanel 엘리먼트 사용하기

■ FlipView 엘리먼트의 ItemsPanel 속성에서 VirtualizingStackPanel 엘리먼트를 사용하는 방법을 보여준다. ▶ 예제 코드 (XAML)


<FlipView Name="flipView"
    Width="480"
    Height="270"
    BorderThickness="1"
    BorderBrush="Black">
    <FlipView.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel Orientation="Vertical" />
        </ItemsPanelTemplate>
    </FlipView.ItemsPanel>
    <FlipView.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Image
                    Width="480"
                    Height="270"
                    Stretch="UniformToFill"
                    Source="{Binding Image}" />
                <Border
                    VerticalAlignment="Bottom"
                    Background="#a5000000"
                    Height="80">
                    <TextBlock
                        Padding="15 20"
                        Foreground="#ccffffff"
                        FontFamily="Segoe UI"
                        FontSize="24"
                        Text="{Binding Name}" />
                </Border>
            </Grid>
        </DataTemplate>
    </FlipView.ItemTemplate>
</FlipView>

<FlipView Name="flipView"

Width="480"

Height="270"

BorderThickness="1"

BorderBrush="Black">

<FlipView.ItemsPanel>

</ItemsPanelTemplate>

</FlipView.ItemsPanel>

<FlipView.ItemTemplate>

<Grid>

<Image

Width="480"

Height="270"

Stretch="UniformToFill"

Source="{Binding Image}" />

<Border

VerticalAlignment="Bottom"

Background="#a5000000"

Height="80">

<TextBlock

Padding="15 20"

Foreground="#ccffffff"

FontFamily="Segoe UI"

FontSize="24"

Text="{Binding Name}" />

</Border>

</Grid>

</DataTemplate>

</FlipView.ItemTemplate>

</FlipView>


<ItemsView
    HorizontalAlignment="Center"
    VerticalAlignment="Center"
    Width="400"
    Height="400">
    <ItemsView.Layout>
        <StackLayout
            Orientation="Vertical"
            Spacing="10" />
    </ItemsView.Layout>
</ItemsView>

<ItemsView

HorizontalAlignment="Center"

VerticalAlignment="Center"

Width="400"

Height="400">

<ItemsView.Layout>

<StackLayout

Orientation="Vertical"

Spacing="10" />

</ItemsView.Layout>

</ItemsView>

[태그:] LAYOUT

[C#/WINUI3/.NET8] ListView 클래스 : ContainerContentChanging 이벤트를 사용해 컨테이너 컨텐트 변경시 처리하기

[C#/WINUI3/.NET8] ScrollViewer 클래스 : CurrentAnchor 속성을 사용해 ItemsRepeater 객체에서 현재 앵커 항목을 구하기

[C#/WINUI3/.NET8] Control 클래스 : ItemsRepeater 객체를 사용해 커스텀 컬렉션 컨트롤 만들기

[C#/WINUI3/.NET8] ItemsRepeater 엘리먼트 : ItemTemplate 속성에서 DateTemplate 객체 내에 ItemsRepeater 객체를 사용해 그룹화된 항목 표시하기 2

[C#/WINUI3/.NET8] UniformGridLayout 엘리먼트 : MinItemWidth/MinColumnSpacing/ItemsJustification 속성 사용하기

[C#/WINUI3/.NET8] StackLayout 엘리먼트 : Orientation/Spacing 속성을 사용해 항목 배열 방향과 간격 설정하기

[C#/WINUI3/.NET8] ScrollViewer 클래스 : ViewChanged 이벤트를 사용해 ItemsRepeater 객체에서 데이터 증분 로드하기

[C#/WINUI3/.NET8] TreeView 클래스 : DragItemsStarting/DragItemsCompleted/DragOver/Drop 이벤트를 사용해 트리뷰 간 노드 DRAG/DROP 처리하기

[C#/WINUI3/.NET8] TreeView 엘리먼트 : ItemTemplateSelector 속성을 사용해 사진/음악 라이브러리 파일 조회하기

[C#/WINUI3/.NET8] TreeView 엘리먼트 : ItemsSource 속성을 사용해 데이터 바인딩하기

[C#/WINUI3/.NET8] TreeView 엘리먼트 : SelectionMode 속성을 사용해 복수 항목 선택하기

[C#/WINUI3/.NET8] TreeView 클래스 : Expanding/Collapsed 이벤트를 사용해 동적 노드 축소/확장하기

[C#/WINUI3/.NET8] TreeView 엘리먼트 : ItemContainerStyle 속성을 사용해 항목 컨테이너 스타일 설정하기

[C#/WINUI3/.NET8] TreeView 엘리먼트 : RootNodes 속성을 사용해 TreeViewNode 객체 추가하기

[C#/WINUI3/.NET8] PipsPager 엘리먼트 : PreviousButtonStyle/NextButtonStyle 속성 사용하기

[C#/WINUI3/.NET8] FlipView 엘리먼트 : ItemsPanel 속성에서 VirtualizingStackPanel 엘리먼트 사용하기

[C#/WINUI3/.NET8] ListView 클래스 : SelectAll/DeselectRange 메소드 사용하기

[C#/WINUI3/.NET8] ListView 클래스 : IsItemClickEnabled 속성/ItemClick 이벤트를 사용해 항목 클릭시 처리하기

[C#/WINUI3/.NET8] ListView 클래스 : SelectionChanged 이벤트를 사용해 선택 변경시 처리하기

[C#/WINUI3/.NET8] ItemsWrapGrid 엘리먼트 : ListView 엘리먼트 항목 표시하기

[C#/WINUI3/.NET8] ItemsStackPanel 엘리먼트 : Orientation 속성을 사용해 ListView 엘리먼트 항목 수평 표시하기

[C#/WINUI3/.NET8] ListView 엘리먼트 : ItemTemplate 속성을 사용해 Items 속성 설정 데이터 표시하기

[C#/WINUI3/.NET8] UniformGridLayout 엘리먼트 : Orientation/MaximumRowsOrColumns/MinRowSpacing/MinColumnSpacing 속성 사용하기

[C#/WINUI3/.NET8] LinedFlowLayout 엘리먼트 : LineHeight/LineSpacing/MinItemSpacing/ItemsStretch 속성 사용하기

[C#/WINUI3/.NET8] StackLayout 엘리먼트 : Orientation/Spacing 속성 사용하기