[WPF] UserControl 사용방법

728x90

UserControl1.xaml

<UserControl x:Class="WpfApp유저컨트롤.UserControls.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:WpfApp유저컨트롤.UserControls"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800" Background="Orange">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <Label Content="{Binding title}" 
               Grid.Row="0" 
               Grid.Column="0" 
               HorizontalAlignment="Center"/>
        
        <StackPanel Orientation="Horizontal" 
                    VerticalAlignment="Center" 
                    Grid.Row="0" 
                    Grid.Column="1">
            
            <Label>현재 글자 수</Label>
            <TextBlock Text="{Binding ElementName=txt,Path=Text.Length}" 
                       VerticalAlignment="Center"></TextBlock>
            <Label>최대 글자 수</Label>
            <TextBlock VerticalAlignment="Center" 
                       Text="{Binding maxCount}">
                
            </TextBlock>
        </StackPanel>
        <TextBox Grid.Row="1" 
                 Grid.ColumnSpan="2" 
                 Name="txt" 
                 MaxLength="{Binding maxCount}" 
                 TextWrapping="Wrap" 
                 AcceptsReturn="True"></TextBox>
        
        <ProgressBar Grid.Row="2" 
                     Grid.ColumnSpan="2" 
                     Height="{Binding pbHeight}" 
                     Name="pb" 
                     Value="{Binding ElementName=txt,Path=Text.Length,Mode=OneWay}" 
                     Maximum="{Binding maxCount}"/>

    </Grid>
</UserControl>

 

UserControl1.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace WpfApp유저컨트롤.UserControls
{
    /// <summary>
    /// UserControl1.xaml에 대한 상호 작용 논리
    /// </summary>
    public partial class UserControl1 : UserControl
    {
        public string title { get; set; }

        public int maxCount { get; set; }

        public int pbHeight { get; set; }

        public UserControl1()
        {
            InitializeComponent();
            DataContext = this;
        }
    }
}

 

 

MainWindow.xaml

<Window x:Class="WpfApp유저컨트롤.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp유저컨트롤"
        xmlns:local2="clr-namespace:WpfApp유저컨트롤.UserControls"
        mc:Ignorable="d"
        Title="MainWindow" Height="550" Width="800">
    <!--xmlns:local2="clr-namespace:WpfApp유저컨트롤.UserControls" 폴더와 연결-->
    <StackPanel>
        <local2:UserControl1 title="제목" 
                             maxCount="30" 
                             pbHeight="20"/>
        <local2:UserControl1 title="제목" 
                     maxCount="30" 
                     pbHeight="20"/>
        <local2:UserControl1 title="제목" 
                     maxCount="30" 
                     pbHeight="20"/>
        <local2:UserControl1 title="제목" 
              maxCount="30" 
              pbHeight="20" x:Name="uc1"/>
        <local2:UserControl1 title="제목" 
              maxCount="30" 
              pbHeight="20" x:Name="uc2"/>

        <local2:UserControl1 title="본문" 
                     maxCount="150" 
                     pbHeight="50"/>
        <Button Click="Button_Click">버튼1</Button>
        <Button Click="Button_Click_1">버튼2</Button>
    </StackPanel>
</Window>

 

MainWindow.cs

using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace WpfApp유저컨트롤
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            //유저컨트롤1 클래스의 txt라는 name을 가진 컨트롤의 Text값을 출력
            MessageBox.Show(uc1.txt.Text);
        }

        private void Button_Click_1(object sender, RoutedEventArgs e)
        {
            //유저컨트롤1 클래스의 pb라는 name을 가진 컨트롤의 value값을 출력
            //uc1, uc2는 같은 유저컨트롤1 클래스이지만 name을 다르게 한 것
            MessageBox.Show(uc2.pb.Value.ToString());
        }
    }
}