본문 바로가기
프로그래밍 속 지혜/WPF

WPF - 이미지 버튼 만들기

by 생속지 2016. 4. 7.
반응형

WPF에서의 매력 중 하나는 개발자가 UX를 자유롭고 쉽게 생성 할 수 있는 것입니다.

버튼에 이미지를 넣거나, 체크박스 등을 쉽게 넣고 이벤트를 처리 할 수도 있습니다.

이미지 버튼을 만드는 간단한 XAML을 소개하고자 합니다.

조금만 WPF를 공부했다면 아래의 XAML 소스는 쉽게 이해하리라 생각됩니다.



Button의 ContentControl에 StackPanel을 배치하고, 그안에 Image와 TextBlock을 배치하면 이미지 버튼을 생성 할 수 있습니다.


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
<Window x:Class="ImageButton.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Button HorizontalAlignment="Left" Margin="50,50,0,0" Name="button1" VerticalAlignment="Top">
            <ContentControl>
                <StackPanel Orientation="Horizontal" Width="Auto" HorizontalAlignment="Left">
                    <Image Source="/ImageButton;component/images/save.gif" Margin="0,0,5,0" Width="20" Height="20" />
                    <TextBlock Text="Image Button" VerticalAlignment="Center" Height="18" Width="Auto" />
                </StackPanel>
            </ContentControl>
        </Button>
    </Grid>
</Window>


반응형

댓글