SCROLL Archives - icodebroker

[C#/WINFORM/TEECHART] TChart 클래스 : Zomm/Panning 속성을 사용해 확대/스크롤시 키 시프트 설정하기

■ TChart 클래스의 Zomm/Panning 속성을 사용해 확대/스크롤시 키 시프트를 설정하는 방법을 보여준다. ▶ MainForm.cs


using System;
using System.Drawing;
using System.Windows.Forms;

using Steema.TeeChart.Drawing;
using Steema.TeeChart.Styles;

namespace TestProject
{
    /// <summary>
    /// 메인 폼
    /// </summary>
    public partial class MainForm : Form
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainForm()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainForm()
        {
            InitializeComponent();

            Text = "TChart 클래스 : Zomm/Panning 속성을 사용해 확대/스크롤시 키 시프트 설정하기";

            this.keyShiftComboBox.DropDownStyle = ComboBoxStyle.DropDownList;

            this.keyShiftComboBox.Items.Add("None"   );
            this.keyShiftComboBox.Items.Add("Shift"  );
            this.keyShiftComboBox.Items.Add("Control");
            this.keyShiftComboBox.Items.Add("Alt"    );

            this.keyShiftComboBox.SelectedIndex = 0;

            this.applyToZoomCheckBox.Checked   = true;
            this.applyToScrollCheckBox.Checked = true;

            this.tChart.Panel.Pen = new ChartPen(Color.Black);

            Line line = new Line(this.tChart.Chart);

            line.FillSampleValues(100);

            this.keyShiftComboBox.SelectedIndexChanged += keyShiftComboBox_SelectedIndexChanged;
            this.applyToZoomCheckBox.CheckedChanged    += applyToZoomCheckBox_CheckedChanged;
            this.applyToScrollCheckBox.CheckedChanged  += applyToScrollCheckBox_CheckedChanged;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private
        //////////////////////////////////////////////////////////////////////////////// Event

        #region 키 시프트 콤보 박스 선택 인덱스 변경시 처리하기 - keyShiftComboBox_SelectedIndexChanged(sender, e)

        /// <summary>
        /// 키 시프트 콤보 박스 선택 인덱스 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void keyShiftComboBox_SelectedIndexChanged(object sender, EventArgs e)
        {
            ApplyKeyShift();
        }

        #endregion
        #region 확대 적용 체크 박스 체크 변경시 처리하기 - applyToZoomCheckBox_CheckedChanged(sender, e)

        /// <summary>
        /// 확대 적용 체크 박스 체크 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void applyToZoomCheckBox_CheckedChanged(object sender, EventArgs e)
        {
            ApplyKeyShift();
        }

        #endregion
        #region 스크롤 적용 체크 박스 체크 변경시 처리하기 - applyToScrollCheckBox_CheckedChanged(sender, e)

        /// <summary>
        /// 스크롤 적용 체크 박스 체크 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void applyToScrollCheckBox_CheckedChanged(object sender, EventArgs e)
        {
            ApplyKeyShift();
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////// Function

        #region 키 시프트 적용하기 - ApplyKeyShift()

        /// <summary>
        /// 키 시프트 적용하기
        /// </summary>
        private void ApplyKeyShift()
        {
            Keys keys = (Keys)Enum.Parse(typeof(Keys), this.keyShiftComboBox.SelectedItem.ToString());

            if(this.applyToZoomCheckBox.Checked)
            {
                this.tChart.Zoom.KeyShift = keys;
            }
            else
            {
                this.tChart.Zoom.KeyShift = Keys.None;
            }

            if(this.applyToScrollCheckBox.Checked)
            {
                this.tChart.Panning.KeyShift = keys;
            }
            else
            {
                this.tChart.Panning.KeyShift = Keys.None;
            }
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

using System;

using System.Drawing;

using System.Windows.Forms;

using Steema.TeeChart.Drawing;

using Steema.TeeChart.Styles;

namespace TestProject

{

/// <summary>

/// 메인 폼

/// </summary>

public partial class MainForm : Form

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainForm()

/// <summary>

/// 생성자

/// </summary>

public MainForm()

{

InitializeComponent();

Text = "TChart 클래스 : Zomm/Panning 속성을 사용해 확대/스크롤시 키 시프트 설정하기";

this.keyShiftComboBox.DropDownStyle = ComboBoxStyle.DropDownList;

this.keyShiftComboBox.Items.Add("None" );

this.keyShiftComboBox.Items.Add("Shift" );

this.keyShiftComboBox.Items.Add("Control");

this.keyShiftComboBox.Items.Add("Alt" );

this.keyShiftComboBox.SelectedIndex = 0;

this.applyToZoomCheckBox.Checked = true;

this.applyToScrollCheckBox.Checked = true;

this.tChart.Panel.Pen = new ChartPen(Color.Black);

Line line = new Line(this.tChart.Chart);

line.FillSampleValues(100);

this.keyShiftComboBox.SelectedIndexChanged += keyShiftComboBox_SelectedIndexChanged;

this.applyToZoomCheckBox.CheckedChanged += applyToZoomCheckBox_CheckedChanged;

this.applyToScrollCheckBox.CheckedChanged += applyToScrollCheckBox_CheckedChanged;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Event

#region 키 시프트 콤보 박스 선택 인덱스 변경시 처리하기 - keyShiftComboBox_SelectedIndexChanged(sender, e)

/// <summary>

/// 키 시프트 콤보 박스 선택 인덱스 변경시 처리하기

/// </summary>

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

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

private void keyShiftComboBox_SelectedIndexChanged(object sender, EventArgs e)

{

ApplyKeyShift();

}

#endregion

#region 확대 적용 체크 박스 체크 변경시 처리하기 - applyToZoomCheckBox_CheckedChanged(sender, e)

/// <summary>

/// 확대 적용 체크 박스 체크 변경시 처리하기

/// </summary>

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

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

private void applyToZoomCheckBox_CheckedChanged(object sender, EventArgs e)

{

ApplyKeyShift();

}

#endregion

#region 스크롤 적용 체크 박스 체크 변경시 처리하기 - applyToScrollCheckBox_CheckedChanged(sender, e)

/// <summary>

/// 스크롤 적용 체크 박스 체크 변경시 처리하기

/// </summary>

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

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

private void applyToScrollCheckBox_CheckedChanged(object sender, EventArgs e)

{

ApplyKeyShift();

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Function

#region 키 시프트 적용하기 - ApplyKeyShift()

/// <summary>

/// 키 시프트 적용하기

/// </summary>

private void ApplyKeyShift()

{

Keys keys = (Keys)Enum.Parse(typeof(Keys), this.keyShiftComboBox.SelectedItem.ToString());

if(this.applyToZoomCheckBox.Checked)

{

this.tChart.Zoom.KeyShift = keys;

}

else

{

this.tChart.Zoom.KeyShift = Keys.None;

}

if(this.applyToScrollCheckBox.Checked)

{

this.tChart.Panning.KeyShift = keys;

}

else

{

this.tChart.Panning.KeyShift = Keys.None;

}

#endregion

}

TestProject.zip

[C#/WINFORM/TEECHART] TChart 클래스 : Axes/Zoom 속성을 사용해 확대/스크롤 처리하기

■ TChart 클래스의 Axes/Zoom 속성을 사용해 확대/스크롤을 처리하는 방법을 보여준다. ▶ MainForm.cs


using System;
using System.Drawing;
using System.Windows.Forms;

using Steema.TeeChart.Drawing;
using Steema.TeeChart.Styles;

namespace TestProject
{
    /// <summary>
    /// 메인 폼
    /// </summary>
    public partial class MainForm : Form
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainForm()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainForm()
        {
            InitializeComponent();

            Text = "TChart 클래스 : Axes/Zoom 속성을 사용해 확대/스크롤 처리하기";

            this.resetButton.Enabled = false;

            this.tChart.Panel.Pen = new ChartPen(Color.Black);

            Line line = new Line(this.tChart.Chart);

            line.FillSampleValues(50);

            this.zoomButton.Click   += zoomButton_Click;
            this.scrollButton.Click += scrollButton_Click;
            this.resetButton.Click  += resetButton_Click;
            this.tChart.Zoomed      += tChart_Zoomed;
            this.tChart.Scroll      += tChart_Scroll;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region 확대 버튼 클릭시 처리하기 - zoomButton_Click(sender, e)

        /// <summary>
        /// 확대 버튼 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void zoomButton_Click(object sender, EventArgs e)
        {
            this.tChart.Zoom.ZoomPercent(110);

            this.resetButton.Enabled = true;
        }

        #endregion
        #region 스크롤 버튼 클릭시 처리하기 - scrollButton_Click(sender, e)

        /// <summary>
        /// 스크롤 버튼 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void scrollButton_Click(object sender, EventArgs e)
        {
            this.tChart.Axes.Bottom.Scroll(2, false);

            this.resetButton.Enabled = true;
        }

        #endregion
        #region 초기화 버튼 클릭시 처리하기 - resetButton_Click(sender, e)

        /// <summary>
        /// 초기화 버튼 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void resetButton_Click(object sender, EventArgs e)
        {
            this.tChart.Axes.Left.Automatic   = true;
            this.tChart.Axes.Bottom.Automatic = true;

            this.resetButton.Enabled = false;

            this.tChart.Refresh();
        }

        #endregion
        #region TChart 확대시 처리하기 - tChart_Zoomed(sender, e)

        /// <summary>
        /// TChart 확대시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void tChart_Zoomed(object sender, EventArgs e)
        {
            this.resetButton.Enabled = true;
        }

        #endregion
        #region TChart 스크롤시 처리하기 - tChart_Scroll(sender, e)

        /// <summary>
        /// TChart 스크롤시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void tChart_Scroll(object sender, EventArgs e)
        {
            this.resetButton.Enabled = true;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

using System;

using System.Drawing;

using System.Windows.Forms;

using Steema.TeeChart.Drawing;

using Steema.TeeChart.Styles;

namespace TestProject

{

/// <summary>

/// 메인 폼

/// </summary>

public partial class MainForm : Form

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainForm()

/// <summary>

/// 생성자

/// </summary>

public MainForm()

{

InitializeComponent();

Text = "TChart 클래스 : Axes/Zoom 속성을 사용해 확대/스크롤 처리하기";

this.resetButton.Enabled = false;

this.tChart.Panel.Pen = new ChartPen(Color.Black);

Line line = new Line(this.tChart.Chart);

line.FillSampleValues(50);

this.zoomButton.Click += zoomButton_Click;

this.scrollButton.Click += scrollButton_Click;

this.resetButton.Click += resetButton_Click;

this.tChart.Zoomed += tChart_Zoomed;

this.tChart.Scroll += tChart_Scroll;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 확대 버튼 클릭시 처리하기 - zoomButton_Click(sender, e)

/// <summary>

/// 확대 버튼 클릭시 처리하기

/// </summary>

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

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

private void zoomButton_Click(object sender, EventArgs e)

{

this.tChart.Zoom.ZoomPercent(110);

this.resetButton.Enabled = true;

}

#endregion

#region 스크롤 버튼 클릭시 처리하기 - scrollButton_Click(sender, e)

/// <summary>

/// 스크롤 버튼 클릭시 처리하기

/// </summary>

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

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

private void scrollButton_Click(object sender, EventArgs e)

{

this.tChart.Axes.Bottom.Scroll(2, false);

this.resetButton.Enabled = true;

}

#endregion

#region 초기화 버튼 클릭시 처리하기 - resetButton_Click(sender, e)

/// <summary>

/// 초기화 버튼 클릭시 처리하기

/// </summary>

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

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

private void resetButton_Click(object sender, EventArgs e)

{

this.tChart.Axes.Left.Automatic = true;

this.tChart.Axes.Bottom.Automatic = true;

this.resetButton.Enabled = false;

this.tChart.Refresh();

}

#endregion

#region TChart 확대시 처리하기 - tChart_Zoomed(sender, e)

/// <summary>

/// TChart 확대시 처리하기

/// </summary>

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

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

private void tChart_Zoomed(object sender, EventArgs e)

{

this.resetButton.Enabled = true;

}

#endregion

#region TChart 스크롤시 처리하기 - tChart_Scroll(sender, e)

/// <summary>

/// TChart 스크롤시 처리하기

/// </summary>

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

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

private void tChart_Scroll(object sender, EventArgs e)

{

this.resetButton.Enabled = true;

}

#endregion

}

TestProject.zip

[C#/WINUI2.5] SemanticZoom 엘리먼트 사용하기

■ SemanticZoom 엘리먼트를 사용하는 방법을 보여준다. ▶ ControlInfoDocumentLink.cs


namespace TestProject
{
    /// <summary>
    /// 컨트롤 정보 문서 링크
    /// </summary>
    public class ControlInfoDocumentLink
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 제목 - Title

        /// <summary>
        /// 제목
        /// </summary>
        public string Title { get; private set; }

        #endregion
        #region URI - URI

        /// <summary>
        /// URI
        /// </summary>
        public string URI { get; private set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - ControlInfoDocumentLink(title, uri)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="title">제목</param>
        /// <param name="uri">URI</param>
        public ControlInfoDocumentLink(string title, string uri)
        {
            Title = title;
            URI   = uri;
        }

        #endregion
    }
}

namespace TestProject

{

/// <summary>

/// 컨트롤 정보 문서 링크

/// </summary>

public class ControlInfoDocumentLink

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 제목 - Title

/// <summary>

/// 제목

/// </summary>

public string Title { get; private set; }

#endregion

#region URI - URI

/// <summary>

/// URI

/// </summary>

public string URI { get; private set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - ControlInfoDocumentLink(title, uri)

/// <summary>

/// 생성자

/// </summary>

/// <param name="title">제목</param>

/// <param name="uri">URI</param>

public ControlInfoDocumentLink(string title, string uri)

{

Title = title;

URI = uri;

}

#endregion

}

▶ ControlInfoDataItem.cs


using System.Collections.ObjectModel;

namespace TestProject
{
    /// <summary>
    /// 컨트롤 정보 데이터 항목
    /// </summary>
    public class ControlInfoDataItem
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 고유 ID - UniqueID

        /// <summary>
        /// 고유 ID
        /// </summary>
        public string UniqueID { get; private set; }

        #endregion
        #region 제목 - Title

        /// <summary>
        /// 제목
        /// </summary>
        public string Title { get; private set; }

        #endregion
        #region 하위 제목 - Subtitle

        /// <summary>
        /// 하위 제목
        /// </summary>
        public string Subtitle { get; private set; }

        #endregion
        #region 설명 - Description

        /// <summary>
        /// 설명
        /// </summary>
        public string Description { get; private set; }

        #endregion
        #region 이미지 경로 - ImagePath

        /// <summary>
        /// 이미지 경로
        /// </summary>
        public string ImagePath { get; private set; }

        #endregion
        #region 배지 문자열 - BadgeString

        /// <summary>
        /// 배지 문자열
        /// </summary>
        public string BadgeString { get; private set; }

        #endregion
        #region 내용 - Content

        /// <summary>
        /// 내용
        /// </summary>
        public string Content { get; private set; }

        #endregion
        #region 신규 여부 - IsNew

        /// <summary>
        /// 신규 여부
        /// </summary>
        public bool IsNew { get; private set; }

        #endregion
        #region 업데이트 여부 - IsUpdated

        /// <summary>
        /// 업데이트 여부
        /// </summary>
        public bool IsUpdated { get; private set; }

        #endregion
        #region 미리보기 여부 - IsPreview

        /// <summary>
        /// 미리보기 여부
        /// </summary>
        public bool IsPreview { get; private set; }

        #endregion
        #region 문서 링크 컬렉션 - DocumentLinkCollection

        /// <summary>
        /// 문서 링크 컬렉션
        /// </summary>
        public ObservableCollection<ControlInfoDocumentLink> DocumentLinkCollection { get; private set; }

        #endregion
        #region 연결 컨트롤 컬렉션 - RelatedControlCollection

        /// <summary>
        /// 연결 컨트롤 컬렉션
        /// </summary>
        public ObservableCollection<string> RelatedControlCollection { get; private set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - ControlInfoDataItem(uniqueID, title, subtitle, imagePath, badgeString, description, content, isNew, isUpdated, isPreview)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="uniqueID">고유 ID</param>
        /// <param name="title">제목</param>
        /// <param name="subtitle">하위 제목</param>
        /// <param name="imagePath">이미지 경로</param>
        /// <param name="badgeString">배지 문자열</param>
        /// <param name="description">설명</param>
        /// <param name="content">내용</param>
        /// <param name="isNew">신규 여부</param>
        /// <param name="isUpdated">업데이트 여부</param>
        /// <param name="isPreview">미리보기 여부</param>
        public ControlInfoDataItem
        (
            string uniqueID,
            string title,
            string subtitle,
            string imagePath,
            string badgeString,
            string description,
            string content,
            bool   isNew,
            bool   isUpdated,
            bool   isPreview
        )
        {
            UniqueID                 = uniqueID;
            Title                    = title;
            Subtitle                 = subtitle;
            ImagePath                = imagePath;
            BadgeString              = badgeString;
            Description              = description;
            Content                  = content;
            IsNew                    = isNew;
            IsUpdated                = isUpdated;
            IsPreview                = isPreview;
            DocumentLinkCollection   = new ObservableCollection<ControlInfoDocumentLink>();
            RelatedControlCollection = new ObservableCollection<string>();
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 문자열 구하기 - ToString()

        /// <summary>
        /// 문자열 구하기
        /// </summary>
        /// <returns>문자열</returns>
        public override string ToString()
        {
            return Title;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

using System.Collections.ObjectModel;

namespace TestProject

{

/// <summary>

/// 컨트롤 정보 데이터 항목

/// </summary>

public class ControlInfoDataItem

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 고유 ID - UniqueID

/// <summary>

/// 고유 ID

/// </summary>

public string UniqueID { get; private set; }

#endregion

#region 제목 - Title

/// <summary>

/// 제목

/// </summary>

public string Title { get; private set; }

#endregion

#region 하위 제목 - Subtitle

/// <summary>

/// 하위 제목

/// </summary>

public string Subtitle { get; private set; }

#endregion

#region 설명 - Description

/// <summary>

/// 설명

/// </summary>

public string Description { get; private set; }

#endregion

#region 이미지 경로 - ImagePath

/// <summary>

/// 이미지 경로

/// </summary>

public string ImagePath { get; private set; }

#endregion

#region 배지 문자열 - BadgeString

/// <summary>

/// 배지 문자열

/// </summary>

public string BadgeString { get; private set; }

#endregion

#region 내용 - Content

/// <summary>

/// 내용

/// </summary>

public string Content { get; private set; }

#endregion

#region 신규 여부 - IsNew

/// <summary>

/// 신규 여부

/// </summary>

public bool IsNew { get; private set; }

#endregion

#region 업데이트 여부 - IsUpdated

/// <summary>

/// 업데이트 여부

/// </summary>

public bool IsUpdated { get; private set; }

#endregion

#region 미리보기 여부 - IsPreview

/// <summary>

/// 미리보기 여부

/// </summary>

public bool IsPreview { get; private set; }

#endregion

#region 문서 링크 컬렉션 - DocumentLinkCollection

/// <summary>

/// 문서 링크 컬렉션

/// </summary>

public ObservableCollection<ControlInfoDocumentLink> DocumentLinkCollection { get; private set; }

#endregion

#region 연결 컨트롤 컬렉션 - RelatedControlCollection

/// <summary>

/// 연결 컨트롤 컬렉션

/// </summary>

public ObservableCollection<string> RelatedControlCollection { get; private set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - ControlInfoDataItem(uniqueID, title, subtitle, imagePath, badgeString, description, content, isNew, isUpdated, isPreview)

/// <summary>

/// 생성자

/// </summary>

/// <param name="uniqueID">고유 ID</param>

/// <param name="title">제목</param>

/// <param name="subtitle">하위 제목</param>

/// <param name="imagePath">이미지 경로</param>

/// <param name="badgeString">배지 문자열</param>

/// <param name="description">설명</param>

/// <param name="content">내용</param>

/// <param name="isNew">신규 여부</param>

/// <param name="isUpdated">업데이트 여부</param>

/// <param name="isPreview">미리보기 여부</param>

public ControlInfoDataItem

(

string uniqueID,

string title,

string subtitle,

string imagePath,

string badgeString,

string description,

string content,

bool isNew,

bool isUpdated,

bool isPreview

)

{

UniqueID = uniqueID;

Title = title;

Subtitle = subtitle;

ImagePath = imagePath;

BadgeString = badgeString;

Description = description;

Content = content;

IsNew = isNew;

IsUpdated = isUpdated;

IsPreview = isPreview;

DocumentLinkCollection = new ObservableCollection<ControlInfoDocumentLink>();

RelatedControlCollection = new ObservableCollection<string>();

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 문자열 구하기 - ToString()

/// <summary>

/// 문자열 구하기

/// </summary>

/// <returns>문자열</returns>

public override string ToString()

{

return Title;

}

#endregion

}

▶ ControlInfoDataGroup.cs


using System.Collections.ObjectModel;

namespace TestProject
{
    /// <summary>
    /// 컨트롤 정보 데이터 그룹
    /// </summary>
    public class ControlInfoDataGroup
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 고유 ID - UniqueID

        /// <summary>
        /// 고유 ID
        /// </summary>
        public string UniqueID { get; private set; }

        #endregion
        #region 제목 - Title

        /// <summary>
        /// 제목
        /// </summary>
        public string Title { get; private set; }

        #endregion
        #region 하위 제목 - Subtitle

        /// <summary>
        /// 하위 제목
        /// </summary>
        public string Subtitle { get; private set; }

        #endregion
        #region 설명 - Description

        /// <summary>
        /// 설명
        /// </summary>
        public string Description { get; private set; }

        #endregion
        #region 이미지 경로 - ImagePath

        /// <summary>
        /// 이미지 경로
        /// </summary>
        public string ImagePath { get; private set; }

        #endregion
        #region 데이터 항목 컬렉션 - DataItemCollection

        /// <summary>
        /// 데이터 항목 컬렉션
        /// </summary>
        public ObservableCollection<ControlInfoDataItem> DataItemCollection { get; private set; }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - ControlInfoDataGroup(uniqueID, title, subtitle, imagePath, description)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="uniqueID">고유 ID</param>
        /// <param name="title">제목</param>
        /// <param name="subtitle">하위 제목</param>
        /// <param name="imagePath">이미지 경로</param>
        /// <param name="description">설명</param>
        public ControlInfoDataGroup(string uniqueID, string title, string subtitle, string imagePath, string description)
        {
            UniqueID           = uniqueID;
            Title              = title;
            Subtitle           = subtitle;
            Description        = description;
            ImagePath          = imagePath;
            DataItemCollection = new ObservableCollection<ControlInfoDataItem>();
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 문자열 구하기 - ToString()

        /// <summary>
        /// 문자열 구하기
        /// </summary>
        /// <returns>문자열</returns>
        public override string ToString()
        {
            return Title;
        }

        #endregion
    }
}

100

101

102

103

104

105

using System.Collections.ObjectModel;

namespace TestProject

{

/// <summary>

/// 컨트롤 정보 데이터 그룹

/// </summary>

public class ControlInfoDataGroup

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 고유 ID - UniqueID

/// <summary>

/// 고유 ID

/// </summary>

public string UniqueID { get; private set; }

#endregion

#region 제목 - Title

/// <summary>

/// 제목

/// </summary>

public string Title { get; private set; }

#endregion

#region 하위 제목 - Subtitle

/// <summary>

/// 하위 제목

/// </summary>

public string Subtitle { get; private set; }

#endregion

#region 설명 - Description

/// <summary>

/// 설명

/// </summary>

public string Description { get; private set; }

#endregion

#region 이미지 경로 - ImagePath

/// <summary>

/// 이미지 경로

/// </summary>

public string ImagePath { get; private set; }

#endregion

#region 데이터 항목 컬렉션 - DataItemCollection

/// <summary>

/// 데이터 항목 컬렉션

/// </summary>

public ObservableCollection<ControlInfoDataItem> DataItemCollection { get; private set; }

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - ControlInfoDataGroup(uniqueID, title, subtitle, imagePath, description)

/// <summary>

/// 생성자

/// </summary>

/// <param name="uniqueID">고유 ID</param>

/// <param name="title">제목</param>

/// <param name="subtitle">하위 제목</param>

/// <param name="imagePath">이미지 경로</param>

/// <param name="description">설명</param>

public ControlInfoDataGroup(string uniqueID, string title, string subtitle, string imagePath, string description)

{

UniqueID = uniqueID;

Title = title;

Subtitle = subtitle;

Description = description;

ImagePath = imagePath;

DataItemCollection = new ObservableCollection<ControlInfoDataItem>();

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 문자열 구하기 - ToString()

/// <summary>

/// 문자열 구하기

/// </summary>

/// <returns>문자열</returns>

public override string ToString()

{

return Title;

}

#endregion

}

▶ ControlInfoDataSource.cs


using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Windows.Data.Json;
using Windows.Storage;

namespace TestProject
{
    /// <summary>
    /// 컨트롤 정보 데이터 소스
    /// </summary>
    public sealed class ControlInfoDataSource
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 잠금 객체
        /// </summary>
        private static readonly object _lockObject = new object();

        /// <summary>
        /// 인스턴스
        /// </summary>
        private static ControlInfoDataSource _instance;

        #endregion

        ////////////////////////////////////////////////////////////////////////////////////////// Instance
        //////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 데이터 그룹 리스트
        /// </summary>
        private IList<ControlInfoDataGroup> dataGroupList = new List<ControlInfoDataGroup>();

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 인스턴스 - Instance

        /// <summary>
        /// 인스턴스
        /// </summary>
        public static ControlInfoDataSource Instance
        {
            get
            {
                return _instance;
            }
        }

        #endregion

        ////////////////////////////////////////////////////////////////////////////////////////// Instance
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 데이터 그룹 리스트 - DataGroupList

        /// <summary>
        /// 데이터 그룹 리스트
        /// </summary>
        public IList<ControlInfoDataGroup> DataGroupList
        {
            get
            {
                return this.dataGroupList;
            }
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Static

        #region 생성자 - ControlInfoDataSource()

        /// <summary>
        /// 생성자
        /// </summary>
        static ControlInfoDataSource()
        {
            _instance = new ControlInfoDataSource();
        }

        #endregion

        ////////////////////////////////////////////////////////////////////////////////////////// Instance
        //////////////////////////////////////////////////////////////////////////////// Private

        #region 생성자 - ControlInfoDataSource()

        /// <summary>
        /// 생성자
        /// </summary>
        private ControlInfoDataSource()
        {
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 데이터 그룹 열거 가능형 구하기 (비동기) - GetDataGroupEnumerableAsync()

        /// <summary>
        /// 데이터 그룹 열거 가능형 구하기 (비동기)
        /// </summary>
        /// <returns>데이터 그룹 열거 가능형</returns>
        public async Task<IEnumerable<ControlInfoDataGroup>> GetDataGroupEnumerableAsync()
        {
            await _instance.GetControlInfoDataAsync();

            return _instance.DataGroupList;
        }

        #endregion
        #region 데이터 그룹 구하기 (비동기) - GetDataGroupAsync(uniqueID)

        /// <summary>
        /// 데이터 그룹 구하기 (비동기)
        /// </summary>
        /// <param name="uniqueID">고유 ID</param>
        /// <returns>데이터 그룹 태스크</returns>
        public async Task<ControlInfoDataGroup> GetDataGroupAsync(string uniqueID)
        {
            await _instance.GetControlInfoDataAsync();

            IEnumerable<ControlInfoDataGroup> dataGroupEnumerable = _instance.DataGroupList.Where((group) => group.UniqueID.Equals(uniqueID));

            if(dataGroupEnumerable.Count() == 1)
            {
                return dataGroupEnumerable.First();
            }

            return null;
        }

        #endregion
        #region 데이터 항목 구하기 (비동기) - GetDataItemAsync(uniqueID)

        /// <summary>
        /// 데이터 항목 구하기 (비동기)
        /// </summary>
        /// <param name="uniqueID">고유 ID</param>
        /// <returns>데이터 항목 태스크</returns>
        public async Task<ControlInfoDataItem> GetDataItemAsync(string uniqueID)
        {
            await _instance.GetControlInfoDataAsync();

            IEnumerable<ControlInfoDataItem> dataItemEnumerable = _instance.DataGroupList.SelectMany(group => group.DataItemCollection)
                                                                                         .Where((item) => item.UniqueID.Equals(uniqueID));

            if(dataItemEnumerable.Count() > 0)
            {
                return dataItemEnumerable.First();
            }

            return null;
        }

        #endregion
        #region 항목에서 데이터 그룹 구하기 (비동기) - GetDataGroupFromItemAsync(uniqueID)

        /// <summary>
        /// 항목에서 데이터 그룹 구하기 (비동기)
        /// </summary>
        /// <param name="uniqueID">고유 ID</param>
        /// <returns>데이터 그룹 태스크</returns>
        public async Task<ControlInfoDataGroup> GetDataGroupFromItemAsync(string uniqueID)
        {
            await _instance.GetControlInfoDataAsync();

            IEnumerable<ControlInfoDataGroup> dataGroupEnumerable = _instance.DataGroupList.Where
            (
                (group) => group.DataItemCollection.FirstOrDefault(item => item.UniqueID.Equals(uniqueID)) != null
            );

            if(dataGroupEnumerable.Count() == 1)
            {
                return dataGroupEnumerable.First();
            }

            return null;
        }

        #endregion

        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region 컨트롤 정보 데이터 구하기 - GetControlInfoDataAsync()

        /// <summary>
        /// 컨트롤 정보 데이터 구하기
        /// </summary>
        /// <returns>태스크</returns>
        private async Task GetControlInfoDataAsync()
        {
            lock(_lockObject)
            {
                if(DataGroupList.Count() != 0)
                {
                    return;
                }
            }

            Uri dataURI = new Uri("ms-appx:///DATA/ControlInfoData.json");

            StorageFile storageFile = await StorageFile.GetFileFromApplicationUriAsync(dataURI);

            string json = await FileIO.ReadTextAsync(storageFile);

            JsonObject jsonObject = JsonObject.Parse(json);
            JsonArray  jsonArray  = jsonObject["Groups"].GetArray();

            lock(_lockObject)
            {
                foreach(JsonValue groupValue in jsonArray)
                {
                    JsonObject groupObject = groupValue.GetObject();

                    ControlInfoDataGroup group = new ControlInfoDataGroup
                    (
                        groupObject["UniqueId"   ].GetString(),
                        groupObject["Title"      ].GetString(),
                        groupObject["Subtitle"   ].GetString(),
                        groupObject["ImagePath"  ].GetString(),
                        groupObject["Description"].GetString()
                    );

                    foreach(JsonValue itemValue in groupObject["Items"].GetArray())
                    {
                        JsonObject itemObject = itemValue.GetObject();

                        string badgeString = null;

                        bool isNew     = itemObject.ContainsKey("IsNew"    ) ? itemObject["IsNew"    ].GetBoolean() : false;
                        bool isUpdated = itemObject.ContainsKey("IsUpdated") ? itemObject["IsUpdated"].GetBoolean() : false;
                        bool isPreview = itemObject.ContainsKey("IsPreview") ? itemObject["IsPreview"].GetBoolean() : false;

                        if(isNew)
                        {
                            badgeString = "New";
                        }
                        else if(isUpdated)
                        {
                            badgeString = "Updated";
                        }
                        else if(isPreview)
                        {
                            badgeString = "Preview";
                        }

                        ControlInfoDataItem item = new ControlInfoDataItem
                        (
                            itemObject["UniqueId"   ].GetString(),
                            itemObject["Title"      ].GetString(),
                            itemObject["Subtitle"   ].GetString(),
                            itemObject["ImagePath"  ].GetString(),
                            badgeString,
                            itemObject["Description"].GetString(),
                            itemObject["Content"    ].GetString(),
                            isNew,
                            isUpdated,
                            isPreview
                        );

                        if(itemObject.ContainsKey("Docs"))
                        {
                            foreach(JsonValue documentValue in itemObject["Docs"].GetArray())
                            {
                                JsonObject documentObject = documentValue.GetObject();

                                item.DocumentLinkCollection.Add
                                (
                                    new ControlInfoDocumentLink
                                    (
                                        documentObject["Title"].GetString(),
                                        documentObject["Uri"  ].GetString()
                                    )
                                );
                            }
                        }

                        if(itemObject.ContainsKey("RelatedControls"))
                        {
                            foreach(JsonValue relatedControlValue in itemObject["RelatedControls"].GetArray())
                            {
                                item.RelatedControlCollection.Add(relatedControlValue.GetString());
                            }
                        }

                        group.DataItemCollection.Add(item);
                    }

                    if(!DataGroupList.Any(g => g.Title == group.Title))
                    {
                        DataGroupList.Add(group);
                    }
                }
            }
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

285

286

287

288

289

290

291

292

293

294

295

296

297

298

299

300

301

302

303

304

305

306

307

308

309

310

311

312

313

314

315

316

317

318

using System;

using System.Collections.Generic;

using System.Linq;

using System.Threading.Tasks;

using Windows.Data.Json;

using Windows.Storage;

namespace TestProject

{

/// <summary>

/// 컨트롤 정보 데이터 소스

/// </summary>

public sealed class ControlInfoDataSource

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 잠금 객체

/// </summary>

private static readonly object _lockObject = new object();

/// <summary>

/// 인스턴스

/// </summary>

private static ControlInfoDataSource _instance;

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Instance

//////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 데이터 그룹 리스트

/// </summary>

private IList<ControlInfoDataGroup> dataGroupList = new List<ControlInfoDataGroup>();

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 인스턴스 - Instance

/// <summary>

/// 인스턴스

/// </summary>

public static ControlInfoDataSource Instance

{

get

{

return _instance;

}

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Instance

//////////////////////////////////////////////////////////////////////////////// Public

#region 데이터 그룹 리스트 - DataGroupList

/// <summary>

/// 데이터 그룹 리스트

/// </summary>

public IList<ControlInfoDataGroup> DataGroupList

{

get

{

return this.dataGroupList;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Static

#region 생성자 - ControlInfoDataSource()

/// <summary>

/// 생성자

/// </summary>

static ControlInfoDataSource()

{

_instance = new ControlInfoDataSource();

}

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Instance

//////////////////////////////////////////////////////////////////////////////// Private

#region 생성자 - ControlInfoDataSource()

/// <summary>

/// 생성자

/// </summary>

private ControlInfoDataSource()

{

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 데이터 그룹 열거 가능형 구하기 (비동기) - GetDataGroupEnumerableAsync()

/// <summary>

/// 데이터 그룹 열거 가능형 구하기 (비동기)

/// </summary>

/// <returns>데이터 그룹 열거 가능형</returns>

public async Task<IEnumerable<ControlInfoDataGroup>> GetDataGroupEnumerableAsync()

{

await _instance.GetControlInfoDataAsync();

return _instance.DataGroupList;

}

#endregion

#region 데이터 그룹 구하기 (비동기) - GetDataGroupAsync(uniqueID)

/// <summary>

/// 데이터 그룹 구하기 (비동기)

/// </summary>

/// <param name="uniqueID">고유 ID</param>

/// <returns>데이터 그룹 태스크</returns>

public async Task<ControlInfoDataGroup> GetDataGroupAsync(string uniqueID)

{

await _instance.GetControlInfoDataAsync();

IEnumerable<ControlInfoDataGroup> dataGroupEnumerable = _instance.DataGroupList.Where((group) => group.UniqueID.Equals(uniqueID));

if(dataGroupEnumerable.Count() == 1)

{

return dataGroupEnumerable.First();

}

return null;

}

#endregion

#region 데이터 항목 구하기 (비동기) - GetDataItemAsync(uniqueID)

/// <summary>

/// 데이터 항목 구하기 (비동기)

/// </summary>

/// <param name="uniqueID">고유 ID</param>

/// <returns>데이터 항목 태스크</returns>

public async Task<ControlInfoDataItem> GetDataItemAsync(string uniqueID)

{

await _instance.GetControlInfoDataAsync();

IEnumerable<ControlInfoDataItem> dataItemEnumerable = _instance.DataGroupList.SelectMany(group => group.DataItemCollection)

.Where((item) => item.UniqueID.Equals(uniqueID));

if(dataItemEnumerable.Count() > 0)

{

return dataItemEnumerable.First();

}

return null;

}

#endregion

#region 항목에서 데이터 그룹 구하기 (비동기) - GetDataGroupFromItemAsync(uniqueID)

/// <summary>

/// 항목에서 데이터 그룹 구하기 (비동기)

/// </summary>

/// <param name="uniqueID">고유 ID</param>

/// <returns>데이터 그룹 태스크</returns>

public async Task<ControlInfoDataGroup> GetDataGroupFromItemAsync(string uniqueID)

{

await _instance.GetControlInfoDataAsync();

IEnumerable<ControlInfoDataGroup> dataGroupEnumerable = _instance.DataGroupList.Where

(

(group) => group.DataItemCollection.FirstOrDefault(item => item.UniqueID.Equals(uniqueID)) != null

);

if(dataGroupEnumerable.Count() == 1)

{

return dataGroupEnumerable.First();

}

return null;

}

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 컨트롤 정보 데이터 구하기 - GetControlInfoDataAsync()

/// <summary>

/// 컨트롤 정보 데이터 구하기

/// </summary>

/// <returns>태스크</returns>

private async Task GetControlInfoDataAsync()

{

lock(_lockObject)

{

if(DataGroupList.Count() != 0)

{

return;

}

Uri dataURI = new Uri("ms-appx:///DATA/ControlInfoData.json");

StorageFile storageFile = await StorageFile.GetFileFromApplicationUriAsync(dataURI);

string json = await FileIO.ReadTextAsync(storageFile);

JsonObject jsonObject = JsonObject.Parse(json);

JsonArray jsonArray = jsonObject["Groups"].GetArray();

lock(_lockObject)

{

foreach(JsonValue groupValue in jsonArray)

{

JsonObject groupObject = groupValue.GetObject();

ControlInfoDataGroup group = new ControlInfoDataGroup

(

groupObject["UniqueId" ].GetString(),

groupObject["Title" ].GetString(),

groupObject["Subtitle" ].GetString(),

groupObject["ImagePath" ].GetString(),

groupObject["Description"].GetString()

);

foreach(JsonValue itemValue in groupObject["Items"].GetArray())

{

JsonObject itemObject = itemValue.GetObject();

string badgeString = null;

bool isNew = itemObject.ContainsKey("IsNew" ) ? itemObject["IsNew" ].GetBoolean() : false;

bool isUpdated = itemObject.ContainsKey("IsUpdated") ? itemObject["IsUpdated"].GetBoolean() : false;

bool isPreview = itemObject.ContainsKey("IsPreview") ? itemObject["IsPreview"].GetBoolean() : false;

if(isNew)

{

badgeString = "New";

}

else if(isUpdated)

{

badgeString = "Updated";

}

else if(isPreview)

{

badgeString = "Preview";

}

ControlInfoDataItem item = new ControlInfoDataItem

(

itemObject["UniqueId" ].GetString(),

itemObject["Title" ].GetString(),

itemObject["Subtitle" ].GetString(),

itemObject["ImagePath" ].GetString(),

badgeString,

itemObject["Description"].GetString(),

itemObject["Content" ].GetString(),

isNew,

isUpdated,

isPreview

);

if(itemObject.ContainsKey("Docs"))

{

foreach(JsonValue documentValue in itemObject["Docs"].GetArray())

{

JsonObject documentObject = documentValue.GetObject();

item.DocumentLinkCollection.Add

(

new ControlInfoDocumentLink

(

documentObject["Title"].GetString(),

documentObject["Uri" ].GetString()

)

);

}

if(itemObject.ContainsKey("RelatedControls"))

{

foreach(JsonValue relatedControlValue in itemObject["RelatedControls"].GetArray())

{

item.RelatedControlCollection.Add(relatedControlValue.GetString());

}

group.DataItemCollection.Add(item);

}

if(!DataGroupList.Any(g => g.Title == group.Title))

{

DataGroupList.Add(group);

}

#endregion

}

▶ MainPage.xaml


<Page x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:wuxdata="using:Windows.UI.Xaml.Data"
    xmlns:local="using:TestProject"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Page.Resources>
        <CollectionViewSource x:Name="collectionViewSource"
            Source="{x:Bind DataGroupEnumerable}"
            IsSourceGrouped="True"
            ItemsPath="DataItemCollection" />
        <DataTemplate x:Key="ZoomInDataTemplateKey" x:DataType="local:ControlInfoDataItem">
            <StackPanel
                Margin="10 5 10 5"
                MinWidth="200"
                Orientation="Horizontal">
                <Image
                    Width="36"
                    Source="{x:Bind ImagePath}" />
                <StackPanel Margin="20 0 0 0">
                    <TextBlock
                        Style="{StaticResource BaseTextBlockStyle}"
                        Text="{x:Bind Title}" />
                    <TextBlock
                        Style="{StaticResource BodyTextBlockStyle}"
                        HorizontalAlignment="Left"
                        Width="300"
                        TextWrapping="Wrap"
                        Text="{x:Bind Subtitle}" />
                </StackPanel>
            </StackPanel>
        </DataTemplate>
        <DataTemplate x:Key="ZoomInGroupHeaderDataTemplateKey" x:DataType="local:ControlInfoDataGroup">
            <TextBlock
                Style="{StaticResource SubtitleTextBlockStyle}"
                Foreground="{ThemeResource ApplicationForegroundThemeBrush}"
                Text="{x:Bind Title}" />
        </DataTemplate>
        <DataTemplate x:Key="ZoomOutDataTemplateKey" x:DataType="wuxdata:ICollectionViewGroup">
            <TextBlock
                Style="{StaticResource SubtitleTextBlockStyle}"
                TextWrapping="Wrap"
                Text="{x:Bind ((local:ControlInfoDataGroup)Group).Title}" />
        </DataTemplate>
    </Page.Resources>
    <Grid>
        <SemanticZoom Name="semanticZoom">
            <SemanticZoom.ZoomedInView>
                <GridView
                    ItemTemplate="{StaticResource ZoomInDataTemplateKey}"
                    ScrollViewer.IsHorizontalScrollChainingEnabled="False"
                    SelectionMode="None"
                    ItemsSource="{x:Bind collectionViewSource.View}"
                    GotFocus="gridView_GotFocus">
                    <GridView.GroupStyle>
                        <GroupStyle HeaderTemplate="{StaticResource ZoomInGroupHeaderDataTemplateKey}" />
                    </GridView.GroupStyle>
                </GridView>
            </SemanticZoom.ZoomedInView>
            <SemanticZoom.ZoomedOutView>
                <ListView
                    ItemTemplate="{StaticResource ZoomOutDataTemplateKey}"
                    SelectionMode="None"
                    ItemsSource="{x:Bind collectionViewSource.View.CollectionGroups}"
                    GotFocus="gridView_GotFocus" />
            </SemanticZoom.ZoomedOutView>
        </SemanticZoom>
    </Grid>
</Page>

<Page x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:wuxdata="using:Windows.UI.Xaml.Data"

xmlns:local="using:TestProject"

Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"

FontFamily="나눔고딕코딩"

FontSize="16">

<Page.Resources>

<CollectionViewSource x:Name="collectionViewSource"

Source="{x:Bind DataGroupEnumerable}"

IsSourceGrouped="True"

ItemsPath="DataItemCollection" />

<StackPanel

Margin="10 5 10 5"

MinWidth="200"

Orientation="Horizontal">

<Image

Width="36"

Source="{x:Bind ImagePath}" />

<TextBlock

Style="{StaticResource BaseTextBlockStyle}"

Text="{x:Bind Title}" />

<TextBlock

Style="{StaticResource BodyTextBlockStyle}"

HorizontalAlignment="Left"

Width="300"

TextWrapping="Wrap"

Text="{x:Bind Subtitle}" />

</StackPanel>

</DataTemplate>

<TextBlock

Style="{StaticResource SubtitleTextBlockStyle}"

Foreground="{ThemeResource ApplicationForegroundThemeBrush}"

Text="{x:Bind Title}" />

</DataTemplate>

<TextBlock

Style="{StaticResource SubtitleTextBlockStyle}"

TextWrapping="Wrap"

Text="{x:Bind ((local:ControlInfoDataGroup)Group).Title}" />

</DataTemplate>

</Page.Resources>

<Grid>

<SemanticZoom.ZoomedInView>

<GridView

ItemTemplate="{StaticResource ZoomInDataTemplateKey}"

ScrollViewer.IsHorizontalScrollChainingEnabled="False"

SelectionMode="None"

ItemsSource="{x:Bind collectionViewSource.View}"

GotFocus="gridView_GotFocus">

<GridView.GroupStyle>

</GridView.GroupStyle>

</GridView>

</SemanticZoom.ZoomedInView>

<SemanticZoom.ZoomedOutView>

<ListView

ItemTemplate="{StaticResource ZoomOutDataTemplateKey}"

SelectionMode="None"

ItemsSource="{x:Bind collectionViewSource.View.CollectionGroups}"

GotFocus="gridView_GotFocus" />

</SemanticZoom.ZoomedOutView>

</SemanticZoom>

</Grid>

</Page>

▶

[C#/WINUI2.5] ScrollViewer 엘리먼트 사용하기

■ ScrollViewer 엘리먼트를 사용하는 기본적인 방법을 보여준다. ▶ MainPage.xaml


<Page x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Grid Margin="10">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"    />
            <ColumnDefinition Width="50"   />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <ScrollViewer Name="scrollViewer" Grid.Column="0"
            IsTabStop="True"
            ZoomMode="Disabled"
            IsVerticalScrollChainingEnabled="True"
            ManipulationCompleted="scrollViewer_ManipulationCompleted">
            <Image
                HorizontalAlignment="Left"
                VerticalAlignment="Top"
                Stretch="None"
                Source="ms-appx:///IMAGE/cliff.jpg" />
        </ScrollViewer>
        <Grid MinWidth="200" Grid.Column="2">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="*"    />
            </Grid.ColumnDefinitions>
            <TextBlock Grid.Row="0" Grid.Column="0"
                VerticalAlignment="Center"
                Margin="0 0 10 0"
                Text="확대/축소 모드" />
            <ComboBox Grid.Row="0" Grid.Column="1"
                HorizontalAlignment="Stretch"
                SelectionChanged="zoomModeComboBox_SelectionChanged">
                <ComboBoxItem>Enabled</ComboBoxItem>
                <ComboBoxItem IsSelected="True">Disabled</ComboBoxItem>
            </ComboBox>
            <Slider Name="zoomSlider" Grid.Row="1" Grid.ColumnSpan="2"
                Margin="0 10 0 0"
                Header="확대/축소"
                IsEnabled="False"
                Minimum="{x:Bind scrollViewer.MinZoomFactor, Mode=OneWay}"
                Maximum="{x:Bind scrollViewer.MaxZoomFactor, Mode=OneWay}"
                Value="1"
                ValueChanged="zoomSlider_ValueChanged" />
            <TextBlock Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2"
                HorizontalAlignment="Center"
                Margin="0 10"
                Text="스크롤 모드" />
            <TextBlock Grid.Row="3" Grid.Column="0"
                VerticalAlignment="Center"
                Margin="0 0 10 0"
                Text="수평" />
            <ComboBox Grid.Row="3" Grid.Column="1"
                HorizontalAlignment="Stretch"
                SelectedIndex="1"
                SelectionChanged="horizontalScrollModeComboBox_SelectionChanged">
                <ComboBoxItem>Auto</ComboBoxItem>
                <ComboBoxItem>Enabled</ComboBoxItem>
                <ComboBoxItem>Disabled</ComboBoxItem>
            </ComboBox>
            <TextBlock Grid.Row="4" Grid.Column="0"
                VerticalAlignment="Center"
                Margin="0 10 10 0"
                Text="수직" />
            <ComboBox Grid.Row="4" Grid.Column="1"
                HorizontalAlignment="Stretch"
                Margin="0 10 0 0"
                SelectedIndex="1"
                SelectionChanged="verticalScrollModeComboBox_SelectionChanged">
                <ComboBoxItem>Auto</ComboBoxItem>
                <ComboBoxItem>Enabled</ComboBoxItem>
                <ComboBoxItem>Disabled</ComboBoxItem>
            </ComboBox>
            <TextBlock Grid.Row="5" Grid.Column="0" Grid.ColumnSpan="2"
                HorizontalAlignment="Center"
                Margin="0 20 0 10"
                Text="스크롤바 표시" />
            <TextBlock Grid.Row="6" Grid.Column="0"
                VerticalAlignment="Center"
                Margin="0 0 10 0"
                Text="수평" />
            <ComboBox Grid.Row="6" Grid.Column="1"
                HorizontalAlignment="Stretch"
                SelectedIndex="3"
                SelectionChanged="horizontalScrollBarVisibilityComboBox_SelectionChanged">
                <ComboBoxItem>Auto</ComboBoxItem>
                <ComboBoxItem>Visible</ComboBoxItem>
                <ComboBoxItem>Hidden</ComboBoxItem>
                <ComboBoxItem>Disabled</ComboBoxItem>
            </ComboBox>
            <TextBlock Grid.Row="7" Grid.Column="0"
                VerticalAlignment="Center"
                Margin="0 10 10 0"
                Text="수직" />
            <ComboBox Grid.Row="7" Grid.Column="1"
                HorizontalAlignment="Stretch"
                Margin="0 10 0 0"
                SelectedIndex="1"
                SelectionChanged="verticalScrollBarVisibilityComboBox_SelectionChanged">
                <ComboBoxItem>Auto</ComboBoxItem>
                <ComboBoxItem>Visible</ComboBoxItem>
                <ComboBoxItem>Hidden</ComboBoxItem>
                <ComboBoxItem>Disabled</ComboBoxItem>
            </ComboBox>
        </Grid>
    </Grid>
</Page>

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

<Page x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"

FontFamily="나눔고딕코딩"

FontSize="16">

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<ScrollViewer Name="scrollViewer" Grid.Column="0"

IsTabStop="True"

ZoomMode="Disabled"

IsVerticalScrollChainingEnabled="True"

ManipulationCompleted="scrollViewer_ManipulationCompleted">

<Image

HorizontalAlignment="Left"

VerticalAlignment="Top"

Stretch="None"

Source="ms-appx:///IMAGE/cliff.jpg" />

</ScrollViewer>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<TextBlock Grid.Row="0" Grid.Column="0"

VerticalAlignment="Center"

Margin="0 0 10 0"

Text="확대/축소 모드" />

<ComboBox Grid.Row="0" Grid.Column="1"

HorizontalAlignment="Stretch"

SelectionChanged="zoomModeComboBox_SelectionChanged">

<ComboBoxItem>Enabled</ComboBoxItem>

<ComboBoxItem IsSelected="True">Disabled</ComboBoxItem>

</ComboBox>

<Slider Name="zoomSlider" Grid.Row="1" Grid.ColumnSpan="2"

Margin="0 10 0 0"

Header="확대/축소"

IsEnabled="False"

Minimum="{x:Bind scrollViewer.MinZoomFactor, Mode=OneWay}"

Maximum="{x:Bind scrollViewer.MaxZoomFactor, Mode=OneWay}"

Value="1"

ValueChanged="zoomSlider_ValueChanged" />

<TextBlock Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2"

HorizontalAlignment="Center"

Margin="0 10"

Text="스크롤 모드" />

<TextBlock Grid.Row="3" Grid.Column="0"

VerticalAlignment="Center"

Margin="0 0 10 0"

Text="수평" />

<ComboBox Grid.Row="3" Grid.Column="1"

HorizontalAlignment="Stretch"

SelectedIndex="1"

SelectionChanged="horizontalScrollModeComboBox_SelectionChanged">

<ComboBoxItem>Enabled</ComboBoxItem>

<ComboBoxItem>Disabled</ComboBoxItem>

</ComboBox>

<TextBlock Grid.Row="4" Grid.Column="0"

VerticalAlignment="Center"

Margin="0 10 10 0"

Text="수직" />

<ComboBox Grid.Row="4" Grid.Column="1"

HorizontalAlignment="Stretch"

Margin="0 10 0 0"

SelectedIndex="1"

SelectionChanged="verticalScrollModeComboBox_SelectionChanged">

<ComboBoxItem>Enabled</ComboBoxItem>

<ComboBoxItem>Disabled</ComboBoxItem>

</ComboBox>

<TextBlock Grid.Row="5" Grid.Column="0" Grid.ColumnSpan="2"

HorizontalAlignment="Center"

Margin="0 20 0 10"

Text="스크롤바 표시" />

<TextBlock Grid.Row="6" Grid.Column="0"

VerticalAlignment="Center"

Margin="0 0 10 0"

Text="수평" />

<ComboBox Grid.Row="6" Grid.Column="1"

HorizontalAlignment="Stretch"

SelectedIndex="3"

SelectionChanged="horizontalScrollBarVisibilityComboBox_SelectionChanged">

<ComboBoxItem>Visible</ComboBoxItem>

<ComboBoxItem>Hidden</ComboBoxItem>

<ComboBoxItem>Disabled</ComboBoxItem>

</ComboBox>

<TextBlock Grid.Row="7" Grid.Column="0"

VerticalAlignment="Center"

Margin="0 10 10 0"

Text="수직" />

<ComboBox Grid.Row="7" Grid.Column="1"

HorizontalAlignment="Stretch"

Margin="0 10 0 0"

SelectedIndex="1"

SelectionChanged="verticalScrollBarVisibilityComboBox_SelectionChanged">

<ComboBoxItem>Visible</ComboBoxItem>

<ComboBoxItem>Hidden</ComboBoxItem>

<ComboBoxItem>Disabled</ComboBoxItem>

</ComboBox>

</Grid>

</Page>

▶ MainPage.xaml.cs


using Windows.Foundation;
using Windows.Graphics.Display;
using Windows.UI.ViewManagement;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Input;

namespace TestProject
{
    /// <summary>
    /// 메인 페이지
    /// </summary>
    public sealed partial class MainPage : Page
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainPage()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainPage()
        {
            InitializeComponent();

            #region 윈도우 크기를 설정한다.

            double width  = 800d;
            double height = 600d;

            double dpi = (double)DisplayInformation.GetForCurrentView().LogicalDpi;

            ApplicationView.PreferredLaunchWindowingMode = ApplicationViewWindowingMode.PreferredLaunchViewSize;

            Size windowSize = new Size(width * 96d / dpi, height * 96d / dpi);

            ApplicationView.PreferredLaunchViewSize = windowSize;

            Window.Current.Activate();

            ApplicationView.GetForCurrentView().TryResizeView(windowSize);

            #endregion
            #region 윈도우 제목을 설정한다.

            ApplicationView.GetForCurrentView().Title = "ScrollViewer 엘리먼트 사용하기";

            #endregion
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region 스크롤 뷰어 조작 완료시 처리하기 - scrollViewer_ManipulationCompleted(sender, e)

        /// <summary>
        /// 스크롤 뷰어 조작 완료시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void scrollViewer_ManipulationCompleted(object sender, ManipulationCompletedRoutedEventArgs e)
        {
            this.zoomSlider.Value = this.scrollViewer.ZoomFactor;
        }

        #endregion
        #region 확대/축소 모드 콤보 박스 선택 변경시 처리하기 - zoomModeComboBox_SelectionChanged(sender, e)

        /// <summary>
        /// 확대/축소 모드 콤보 박스 선택 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void zoomModeComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            if(this.scrollViewer != null && this.zoomSlider != null)
            {
                if(sender is ComboBox comboBox)
                {
                    switch(comboBox.SelectedIndex)
                    {
                        case 0 : // Enabled

                            this.scrollViewer.ZoomMode = ZoomMode.Enabled;

                            this.zoomSlider.IsEnabled = true;

                            break;

                        case 1 : // Disabled
                        default : // Disabled

                            this.scrollViewer.ZoomMode = ZoomMode.Disabled;

                            this.scrollViewer.ChangeView(null, null, (float)1.0);

                            this.zoomSlider.Value     = 1;
                            this.zoomSlider.IsEnabled = false;

                            break;
                    }
                }
            }
        }

        #endregion
        #region 확대/축소 슬라이더 값 변경시 처리하기 - zoomSlider_ValueChanged(sender, e)

        /// <summary>
        /// 확대/축소 슬라이더 값 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void zoomSlider_ValueChanged(object sender, RangeBaseValueChangedEventArgs e)
        {
            if(this.scrollViewer != null)
            {
                this.scrollViewer.ChangeView(null, null, (float)e.NewValue);
            }
        }

        #endregion
        #region 수평 스크롤 모드 콤보 박스 선택 변경시 처리하기 - horizontalScrollModeComboBox_SelectionChanged(sender, e)

        /// <summary>
        /// 수평 스크롤 모드 콤보 박스 선택 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void horizontalScrollModeComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            if(this.scrollViewer != null)
            {
                if(sender is ComboBox comboBox)
                {
                    switch(comboBox.SelectedIndex)
                    {
                        case 0  : this.scrollViewer.HorizontalScrollMode = ScrollMode.Auto;     break;
                        case 1  : this.scrollViewer.HorizontalScrollMode = ScrollMode.Enabled;  break;
                        case 2  : this.scrollViewer.HorizontalScrollMode = ScrollMode.Disabled; break;
                        default : this.scrollViewer.HorizontalScrollMode = ScrollMode.Enabled;  break;
                    }
                }
            }
        }

        #endregion
        #region 수직 스크롤 모드 콤보 박스 선택 변경시 처리하기 - verticalScrollModeComboBox_SelectionChanged(sender, e)

        /// <summary>
        /// 수직 스크롤 모드 콤보 박스 선택 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e"></param>
        private void verticalScrollModeComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            if(this.scrollViewer != null)
            {
                if(sender is ComboBox comboBox)
                {
                    switch(comboBox.SelectedIndex)
                    {
                        case 0  : this.scrollViewer.VerticalScrollMode = ScrollMode.Auto;     break;
                        case 1  : this.scrollViewer.VerticalScrollMode = ScrollMode.Enabled;  break;
                        case 2  : this.scrollViewer.VerticalScrollMode = ScrollMode.Disabled; break;
                        default : this.scrollViewer.VerticalScrollMode = ScrollMode.Enabled;  break;
                    }
                }
            }
        }

        #endregion
        #region 수평 스크롤바 표시 콤보 박스 선택 변경시 처리하기 - horizontalScrollBarVisibilityComboBox_SelectionChanged(sender, e)

        /// <summary>
        /// 수평 스크롤바 표시 콤보 박스 선택 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void horizontalScrollBarVisibilityComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            if(this.scrollViewer != null)
            {
                if(sender is ComboBox comboBox)
                {
                    switch(comboBox.SelectedIndex)
                    {
                        case 0  : this.scrollViewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Auto;     break;
                        case 1  : this.scrollViewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Visible;  break;
                        case 2  : this.scrollViewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Hidden;   break;
                        case 3  : this.scrollViewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Disabled; break;
                        default : this.scrollViewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Disabled; break;
                    }
                }
            }
        }

        #endregion
        #region 수직 스크롤바 표시 콤보 박스 선택 변경시 처리하기 - verticalScrollBarVisibilityComboBox_SelectionChanged(sender, e)

        /// <summary>
        /// 수직 스크롤바 표시 콤보 박스 선택 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void verticalScrollBarVisibilityComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            if(this.scrollViewer != null)
            {
                if(sender is ComboBox comboBox)
                {
                    switch(comboBox.SelectedIndex)
                    {
                        case 0  : this.scrollViewer.VerticalScrollBarVisibility = ScrollBarVisibility.Auto;     break;
                        case 1  : this.scrollViewer.VerticalScrollBarVisibility = ScrollBarVisibility.Visible;  break;
                        case 2  : this.scrollViewer.VerticalScrollBarVisibility = ScrollBarVisibility.Hidden;   break;
                        case 3  : this.scrollViewer.VerticalScrollBarVisibility = ScrollBarVisibility.Disabled; break;
                        default : this.scrollViewer.VerticalScrollBarVisibility = ScrollBarVisibility.Visible;  break;
                    }
                }
            }
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

using Windows.Foundation;

using Windows.Graphics.Display;

using Windows.UI.ViewManagement;

using Windows.UI.Xaml;

using Windows.UI.Xaml.Controls;

using Windows.UI.Xaml.Controls.Primitives;

using Windows.UI.Xaml.Input;

namespace TestProject

{

/// <summary>

/// 메인 페이지

/// </summary>

public sealed partial class MainPage : Page

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

InitializeComponent();

#region 윈도우 크기를 설정한다.

double width = 800d;

double height = 600d;

double dpi = (double)DisplayInformation.GetForCurrentView().LogicalDpi;

ApplicationView.PreferredLaunchWindowingMode = ApplicationViewWindowingMode.PreferredLaunchViewSize;

Size windowSize = new Size(width * 96d / dpi, height * 96d / dpi);

ApplicationView.PreferredLaunchViewSize = windowSize;

Window.Current.Activate();

ApplicationView.GetForCurrentView().TryResizeView(windowSize);

#endregion

#region 윈도우 제목을 설정한다.

ApplicationView.GetForCurrentView().Title = "ScrollViewer 엘리먼트 사용하기";

#endregion

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 스크롤 뷰어 조작 완료시 처리하기 - scrollViewer_ManipulationCompleted(sender, e)

/// <summary>

/// 스크롤 뷰어 조작 완료시 처리하기

/// </summary>

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

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

private void scrollViewer_ManipulationCompleted(object sender, ManipulationCompletedRoutedEventArgs e)

{

this.zoomSlider.Value = this.scrollViewer.ZoomFactor;

}

#endregion

#region 확대/축소 모드 콤보 박스 선택 변경시 처리하기 - zoomModeComboBox_SelectionChanged(sender, e)

/// <summary>

/// 확대/축소 모드 콤보 박스 선택 변경시 처리하기

/// </summary>

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

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

private void zoomModeComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

if(this.scrollViewer != null && this.zoomSlider != null)

{

if(sender is ComboBox comboBox)

{

switch(comboBox.SelectedIndex)

{

case 0 : // Enabled

this.scrollViewer.ZoomMode = ZoomMode.Enabled;

this.zoomSlider.IsEnabled = true;

break;

case 1 : // Disabled

default : // Disabled

this.scrollViewer.ZoomMode = ZoomMode.Disabled;

this.scrollViewer.ChangeView(null, null, (float)1.0);

this.zoomSlider.Value = 1;

this.zoomSlider.IsEnabled = false;

break;

}

#endregion

#region 확대/축소 슬라이더 값 변경시 처리하기 - zoomSlider_ValueChanged(sender, e)

/// <summary>

/// 확대/축소 슬라이더 값 변경시 처리하기

/// </summary>

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

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

private void zoomSlider_ValueChanged(object sender, RangeBaseValueChangedEventArgs e)

{

if(this.scrollViewer != null)

{

this.scrollViewer.ChangeView(null, null, (float)e.NewValue);

}

#endregion

#region 수평 스크롤 모드 콤보 박스 선택 변경시 처리하기 - horizontalScrollModeComboBox_SelectionChanged(sender, e)

/// <summary>

/// 수평 스크롤 모드 콤보 박스 선택 변경시 처리하기

/// </summary>

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

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

private void horizontalScrollModeComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

if(this.scrollViewer != null)

{

if(sender is ComboBox comboBox)

{

switch(comboBox.SelectedIndex)

{

case 0 : this.scrollViewer.HorizontalScrollMode = ScrollMode.Auto; break;

case 1 : this.scrollViewer.HorizontalScrollMode = ScrollMode.Enabled; break;

case 2 : this.scrollViewer.HorizontalScrollMode = ScrollMode.Disabled; break;

default : this.scrollViewer.HorizontalScrollMode = ScrollMode.Enabled; break;

}

#endregion

#region 수직 스크롤 모드 콤보 박스 선택 변경시 처리하기 - verticalScrollModeComboBox_SelectionChanged(sender, e)

/// <summary>

/// 수직 스크롤 모드 콤보 박스 선택 변경시 처리하기

/// </summary>

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

/// <param name="e"></param>

private void verticalScrollModeComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

if(this.scrollViewer != null)

{

if(sender is ComboBox comboBox)

{

switch(comboBox.SelectedIndex)

{

case 0 : this.scrollViewer.VerticalScrollMode = ScrollMode.Auto; break;

case 1 : this.scrollViewer.VerticalScrollMode = ScrollMode.Enabled; break;

case 2 : this.scrollViewer.VerticalScrollMode = ScrollMode.Disabled; break;

default : this.scrollViewer.VerticalScrollMode = ScrollMode.Enabled; break;

}

#endregion

#region 수평 스크롤바 표시 콤보 박스 선택 변경시 처리하기 - horizontalScrollBarVisibilityComboBox_SelectionChanged(sender, e)

/// <summary>

/// 수평 스크롤바 표시 콤보 박스 선택 변경시 처리하기

/// </summary>

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

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

private void horizontalScrollBarVisibilityComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

if(this.scrollViewer != null)

{

if(sender is ComboBox comboBox)

{

switch(comboBox.SelectedIndex)

{

case 0 : this.scrollViewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Auto; break;

case 1 : this.scrollViewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Visible; break;

case 2 : this.scrollViewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Hidden; break;

case 3 : this.scrollViewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Disabled; break;

default : this.scrollViewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Disabled; break;

}

#endregion

#region 수직 스크롤바 표시 콤보 박스 선택 변경시 처리하기 - verticalScrollBarVisibilityComboBox_SelectionChanged(sender, e)

/// <summary>

/// 수직 스크롤바 표시 콤보 박스 선택 변경시 처리하기

/// </summary>

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

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

private void verticalScrollBarVisibilityComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

if(this.scrollViewer != null)

{

if(sender is ComboBox comboBox)

{

switch(comboBox.SelectedIndex)

{

case 0 : this.scrollViewer.VerticalScrollBarVisibility = ScrollBarVisibility.Auto; break;

case 1 : this.scrollViewer.VerticalScrollBarVisibility = ScrollBarVisibility.Visible; break;

case 2 : this.scrollViewer.VerticalScrollBarVisibility = ScrollBarVisibility.Hidden; break;

case 3 : this.scrollViewer.VerticalScrollBarVisibility = ScrollBarVisibility.Disabled; break;

default : this.scrollViewer.VerticalScrollBarVisibility = ScrollBarVisibility.Visible; break;

}

#endregion

}

TestProject.zip

[C#/WPF] ScrollViewer 클래스 : 애니메이션 스크롤 뷰어 사용하기

■ ScrollViewer 클래스에서 애니메이션 스크롤 뷰어를 사용하는 방법을 보여준다. ▶ AnimationScrollViewer.cs


using System.Windows;
using System.Windows.Controls;

namespace TestProject
{
    /// <summary>
    /// 애니메이션 스크롤 뷰어
    /// </summary>
    public class AnimationScrollViewer : ScrollViewer
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Dependency Property
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 현재 수평 오프셋 속성 - CurrentHorizontalOffsetProperty

        /// <summary>
        /// 현재 수평 오프셋 속성
        /// </summary>
        public static DependencyProperty CurrentHorizontalOffsetProperty = DependencyProperty.Register
        (
            "CurrentHorizontalOffsetOffset",
            typeof(double),
            typeof(AnimationScrollViewer),
            new PropertyMetadata(new PropertyChangedCallback(CurrentHorizontalOffsetPropertyChangedCallback))
        );

        #endregion
        #region 현재 수직 오프셋 속성 - CurrentVerticalOffsetProperty

        /// <summary>
        /// 현재 수직 오프셋 속성
        /// </summary>
        public static DependencyProperty CurrentVerticalOffsetProperty = DependencyProperty.Register
        (
            "CurrentVerticalOffset",
            typeof(double),
            typeof(AnimationScrollViewer),
            new PropertyMetadata(new PropertyChangedCallback(CurrentVerticalOffsetPropertyChangedCallBack))
        );

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 현재 수평 오프셋 - CurrentHorizontalOffset

        /// <summary>
        /// 현재 수평 오프셋
        /// </summary>
        public double CurrentHorizontalOffset
        {
            get
            {
                return (double)GetValue(CurrentHorizontalOffsetProperty);
            }
            set
            {
                SetValue(CurrentHorizontalOffsetProperty, value);
            }
        }

        #endregion
        #region 현재 수직 오프셋 - CurrentVerticalOffset

        /// <summary>
        /// 현재 수직 오프셋
        /// </summary>
        public double CurrentVerticalOffset
        {
            get
            {
                return (double)GetValue(CurrentVerticalOffsetProperty);
            }
            set
            {
                SetValue(CurrentVerticalOffsetProperty, value);
            }
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Private

        #region 현재 수평 오프셋 속성 변경시 콜백 처리하기 - CurrentHorizontalOffsetPropertyChangedCallback(d, e)

        /// <summary>
        /// 현재 수평 오프셋 속성 변경시 콜백 처리하기
        /// </summary>
        /// <param name="d">의존 객체</param>
        /// <param name="e">이벤트 인자</param>
        private static void CurrentHorizontalOffsetPropertyChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            AnimationScrollViewer viewer = d as AnimationScrollViewer;

            viewer.ScrollToHorizontalOffset((double)e.NewValue);
        }

        #endregion
        #region 현재 수직 오프셋 속성 변경시 콜백 처리하기 - CurrentVerticalOffsetPropertyChangedCallBack(d, e)

        /// <summary>
        /// 현재 수직 오프셋 속성 변경시 콜백 처리하기
        /// </summary>
        /// <param name="d">의존 객체</param>
        /// <param name="e">이벤트 인자</param>
        private static void CurrentVerticalOffsetPropertyChangedCallBack(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            AnimationScrollViewer viewer = d as AnimationScrollViewer;

            viewer.ScrollToVerticalOffset((double)e.NewValue);
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

using System.Windows;

using System.Windows.Controls;

namespace TestProject

{

/// <summary>

/// 애니메이션 스크롤 뷰어

/// </summary>

public class AnimationScrollViewer : ScrollViewer

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Dependency Property

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 현재 수평 오프셋 속성 - CurrentHorizontalOffsetProperty

/// <summary>

/// 현재 수평 오프셋 속성

/// </summary>

public static DependencyProperty CurrentHorizontalOffsetProperty = DependencyProperty.Register

(

"CurrentHorizontalOffsetOffset",

typeof(double),

typeof(AnimationScrollViewer),

new PropertyMetadata(new PropertyChangedCallback(CurrentHorizontalOffsetPropertyChangedCallback))

);

#endregion

#region 현재 수직 오프셋 속성 - CurrentVerticalOffsetProperty

/// <summary>

/// 현재 수직 오프셋 속성

/// </summary>

public static DependencyProperty CurrentVerticalOffsetProperty = DependencyProperty.Register

(

"CurrentVerticalOffset",

typeof(double),

typeof(AnimationScrollViewer),

new PropertyMetadata(new PropertyChangedCallback(CurrentVerticalOffsetPropertyChangedCallBack))

);

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 현재 수평 오프셋 - CurrentHorizontalOffset

/// <summary>

/// 현재 수평 오프셋

/// </summary>

public double CurrentHorizontalOffset

{

get

{

return (double)GetValue(CurrentHorizontalOffsetProperty);

}

set

{

SetValue(CurrentHorizontalOffsetProperty, value);

}

#endregion

#region 현재 수직 오프셋 - CurrentVerticalOffset

/// <summary>

/// 현재 수직 오프셋

/// </summary>

public double CurrentVerticalOffset

{

get

{

return (double)GetValue(CurrentVerticalOffsetProperty);

}

set

{

SetValue(CurrentVerticalOffsetProperty, value);

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Private

#region 현재 수평 오프셋 속성 변경시 콜백 처리하기 - CurrentHorizontalOffsetPropertyChangedCallback(d, e)

/// <summary>

/// 현재 수평 오프셋 속성 변경시 콜백 처리하기

/// </summary>

/// <param name="d">의존 객체</param>

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

private static void CurrentHorizontalOffsetPropertyChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)

{

AnimationScrollViewer viewer = d as AnimationScrollViewer;

viewer.ScrollToHorizontalOffset((double)e.NewValue);

}

#endregion

#region 현재 수직 오프셋 속성 변경시 콜백 처리하기 - CurrentVerticalOffsetPropertyChangedCallBack(d, e)

/// <summary>

/// 현재 수직 오프셋 속성 변경시 콜백 처리하기

/// </summary>

/// <param name="d">의존 객체</param>

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

private static void CurrentVerticalOffsetPropertyChangedCallBack(DependencyObject d, DependencyPropertyChangedEventArgs e)

{

AnimationScrollViewer viewer = d as AnimationScrollViewer;

viewer.ScrollToVerticalOffset((double)e.NewValue);

}

#endregion

}

▶ MainWindow.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:TestProject"
    Width="800"
    Height="600"
    Title="ScrollViewer 클래스 : 애니메이션 스크롤 뷰어 사용하기"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Grid Margin="10">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"    />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <local:AnimationScrollViewer x:Name="animationScrollViewer" Grid.Row="0"
            HorizontalAlignment="Stretch"
            VerticalAlignment="Stretch">
            <StackPanel Name="contentStackPanel" />
        </local:AnimationScrollViewer>
        <StackPanel Grid.Row="1"
            Margin="0 10 0 0"
            HorizontalAlignment="Right"
            Orientation="Horizontal">
            <ComboBox Name="targetComboBox"
                VerticalAlignment="Center"
                Width="150"
                Height="25" />
            <Button Name="animateButton"
                Margin="10 0 0 0"
                VerticalAlignment="Center"
                Width="150"
                Height="30"
                Content="애니메이션 시작" />
        </StackPanel>
    </Grid>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:local="clr-namespace:TestProject"

Width="800"

Height="600"

Title="ScrollViewer 클래스 : 애니메이션 스크롤 뷰어 사용하기"

FontFamily="나눔고딕코딩"

FontSize="16">

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<local:AnimationScrollViewer x:Name="animationScrollViewer" Grid.Row="0"

HorizontalAlignment="Stretch"

VerticalAlignment="Stretch">

</local:AnimationScrollViewer>

<StackPanel Grid.Row="1"

Margin="0 10 0 0"

HorizontalAlignment="Right"

Orientation="Horizontal">

<ComboBox Name="targetComboBox"

VerticalAlignment="Center"

Width="150"

Height="25" />

<Button Name="animateButton"

Margin="10 0 0 0"

VerticalAlignment="Center"

Width="150"

Height="30"

Content="애니메이션 시작" />

</StackPanel>

</Grid>

</Window>

▶ MainWindow.xaml.cs


using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media.Animation;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 항목 카운트
        /// </summary>
        private const int ITEM_COUNT = 50;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            for(int i = 0; i < ITEM_COUNT; i++)
            {
                Button button = CreateButton(i);

                ListViewItem item = new ListViewItem();

                item.Tag     = button;
                item.Content = "버튼 " + i.ToString();

                this.targetComboBox.Items.Add(item);

                this.contentStackPanel.Children.Add(button);

                this.animateButton.Click += animateButton_Click;
            }
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private
        //////////////////////////////////////////////////////////////////////////////// Event

        #region 애니메이션 시작 버튼 클릭시 처리하기 - animateButton_Click(sender, e)

        /// <summary>
        /// 애니메이션 시작 버튼 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void animateButton_Click(object sender, RoutedEventArgs e)
        {
            Button button = ((ListViewItem)this.targetComboBox.SelectedItem).Tag as Button;

            Point relativePoint = button.TransformToAncestor(this.contentStackPanel).Transform(new Point(0, 0));

            ScrollToPosition(relativePoint.X, relativePoint.Y);
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////// Function

        #region 버튼 생성하기 - CreateButton(index)

        /// <summary>
        /// 버튼 생성하기
        /// </summary>
        /// <param name="index">인덱스</param>
        /// <returns>버튼</returns>
        private Button CreateButton(int index)
        {
            Button button = new Button();

            button.Margin  = new Thickness(5);
            button.Height  = 30;
            button.Content = "버튼 " + index.ToString();

            return button;
        }

        #endregion
        #region 위치까지 스크롤하기 - ScrollToPosition(x, y)

        /// <summary>
        /// 위치까지 스크롤하기
        /// </summary>
        /// <param name="x">X</param>
        /// <param name="y">Y</param>
        private void ScrollToPosition(double x, double y)
        {
            DoubleAnimation xAnimation = new DoubleAnimation();

            xAnimation.From = this.animationScrollViewer.HorizontalOffset;
            xAnimation.To = x;
            xAnimation.DecelerationRatio = 0.2;
            xAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(1000));

            DoubleAnimation yAnimation = new DoubleAnimation();

            yAnimation.From              = this.animationScrollViewer.VerticalOffset;
            yAnimation.To                = y;
            yAnimation.DecelerationRatio = 0.2;
            yAnimation.Duration          = new Duration(TimeSpan.FromMilliseconds(500));

            Storyboard storyboard = new Storyboard();

            storyboard.Children.Add(xAnimation);
            storyboard.Children.Add(yAnimation);

            Storyboard.SetTarget(xAnimation, this.animationScrollViewer);
            Storyboard.SetTargetProperty(xAnimation, new PropertyPath(AnimationScrollViewer.CurrentHorizontalOffsetProperty));

            Storyboard.SetTarget(yAnimation, this.animationScrollViewer);
            Storyboard.SetTargetProperty(yAnimation, new PropertyPath(AnimationScrollViewer.CurrentVerticalOffsetProperty));

            storyboard.Begin();
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

using System;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Media.Animation;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 항목 카운트

/// </summary>

private const int ITEM_COUNT = 50;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

for(int i = 0; i < ITEM_COUNT; i++)

{

Button button = CreateButton(i);

ListViewItem item = new ListViewItem();

item.Tag = button;

item.Content = "버튼 " + i.ToString();

this.targetComboBox.Items.Add(item);

this.contentStackPanel.Children.Add(button);

this.animateButton.Click += animateButton_Click;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Event

#region 애니메이션 시작 버튼 클릭시 처리하기 - animateButton_Click(sender, e)

/// <summary>

/// 애니메이션 시작 버튼 클릭시 처리하기

/// </summary>

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

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

private void animateButton_Click(object sender, RoutedEventArgs e)

{

Button button = ((ListViewItem)this.targetComboBox.SelectedItem).Tag as Button;

Point relativePoint = button.TransformToAncestor(this.contentStackPanel).Transform(new Point(0, 0));

ScrollToPosition(relativePoint.X, relativePoint.Y);

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Function

#region 버튼 생성하기 - CreateButton(index)

/// <summary>

/// 버튼 생성하기

/// </summary>

/// <param name="index">인덱스</param>

/// <returns>버튼</returns>

private Button CreateButton(int index)

{

Button button = new Button();

button.Margin = new Thickness(5);

button.Height = 30;

button.Content = "버튼 " + index.ToString();

return button;

}

#endregion

#region 위치까지 스크롤하기 - ScrollToPosition(x, y)

/// <summary>

/// 위치까지 스크롤하기

/// </summary>

/// <param name="x">X</param>

/// <param name="y">Y</param>

private void ScrollToPosition(double x, double y)

{

DoubleAnimation xAnimation = new DoubleAnimation();

xAnimation.From = this.animationScrollViewer.HorizontalOffset;

xAnimation.To = x;

xAnimation.DecelerationRatio = 0.2;

xAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(1000));

DoubleAnimation yAnimation = new DoubleAnimation();

yAnimation.From = this.animationScrollViewer.VerticalOffset;

yAnimation.To = y;

yAnimation.DecelerationRatio = 0.2;

yAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(500));

Storyboard storyboard = new Storyboard();

storyboard.Children.Add(xAnimation);

storyboard.Children.Add(yAnimation);

Storyboard.SetTarget(xAnimation, this.animationScrollViewer);

Storyboard.SetTargetProperty(xAnimation, new PropertyPath(AnimationScrollViewer.CurrentHorizontalOffsetProperty));

Storyboard.SetTarget(yAnimation, this.animationScrollViewer);

Storyboard.SetTargetProperty(yAnimation, new PropertyPath(AnimationScrollViewer.CurrentVerticalOffsetProperty));

storyboard.Begin();

}

#endregion

}

TestProject.zip

[C#/WPF] ScrollViewer 클래스 : 마우스를 사용해 스크롤하기

■ ScrollViewer 클래스에서 마우스를 사용해 스크롤하는 방법을 보여준다. ▶ MainWindow.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="ScrollViewer 클래스 : 마우스를 사용해 스크롤하기"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Window.Resources>
        <Style x:Key="ScrollViewerStyleKey" TargetType="{x:Type ScrollViewer}">
            <Setter Property="HorizontalScrollBarVisibility" Value="Hidden" />
            <Setter Property="VerticalScrollBarVisibility"   Value="Hidden" />
        </Style>
    </Window.Resources>
    <Grid>
        <ScrollViewer Name="scrollViewer"
            Style="{StaticResource ScrollViewerStyleKey}">
            <ItemsControl Name="itemsControl"
                VerticalAlignment="Center">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Vertical" />
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
            </ItemsControl>
        </ScrollViewer>
    </Grid>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="800"

Height="600"

Title="ScrollViewer 클래스 : 마우스를 사용해 스크롤하기"

FontFamily="나눔고딕코딩"

FontSize="16">

<Window.Resources>

</Style>

</Window.Resources>

<Grid>

<ScrollViewer Name="scrollViewer"

Style="{StaticResource ScrollViewerStyleKey}">

<ItemsControl Name="itemsControl"

VerticalAlignment="Center">

<ItemsControl.ItemsPanel>

</ItemsPanelTemplate>

</ItemsControl.ItemsPanel>

</ItemsControl>

</ScrollViewer>

</Grid>

</Window>

▶ MainWindow.xaml.cs


using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Shapes;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 스크롤 시작 포인트
        /// </summary>
        private Point scrollStartPoint;

        /// <summary>
        /// 스크롤 시작 오프셋
        /// </summary>
        private Point scrollStartOffset;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            SetItemsControlData();
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Protected
        //////////////////////////////////////////////////////////////////////////////// Function

        #region PREVIEW 마우스 DOWN 처리하기 - OnPreviewMouseDown(e)

        /// <summary>
        /// PREVIEW 마우스 DOWN 처리하기
        /// </summary>
        /// <param name="e">이벤트 인자</param>
        protected override void OnPreviewMouseDown(MouseButtonEventArgs e)
        {
            if(this.scrollViewer.IsMouseOver)
            {
                this.scrollStartPoint = e.GetPosition(this);

                this.scrollStartOffset.X = this.scrollViewer.HorizontalOffset;
                this.scrollStartOffset.Y = this.scrollViewer.VerticalOffset;

                Cursor = (this.scrollViewer.ExtentWidth  > this.scrollViewer.ViewportWidth ) ||
                         (this.scrollViewer.ExtentHeight > this.scrollViewer.ViewportHeight) ? Cursors.ScrollAll : Cursors.Arrow;

                CaptureMouse();
            }

            base.OnPreviewMouseDown(e);
        }

        #endregion
        #region PREVIEW 마우스 이동시 처리하기 - OnPreviewMouseMove(e)

        /// <summary>
        /// PREVIEW 마우스 이동시 처리하기
        /// </summary>
        /// <param name="e">이벤트 인자</param>
        protected override void OnPreviewMouseMove(MouseEventArgs e)
        {
            if(IsMouseCaptured)
            {
                Point mousePoint = e.GetPosition(this);

                Point delta = new Point
                (
                    (mousePoint.X > this.scrollStartPoint.X) ? -(mousePoint.X - this.scrollStartPoint.X) : (this.scrollStartPoint.X - mousePoint.X),
                    (mousePoint.Y > this.scrollStartPoint.Y) ? -(mousePoint.Y - this.scrollStartPoint.Y) : (this.scrollStartPoint.Y - mousePoint.Y)
                );

                this.scrollViewer.ScrollToHorizontalOffset(this.scrollStartOffset.X + delta.X);
                this.scrollViewer.ScrollToVerticalOffset  (this.scrollStartOffset.Y + delta.Y);
            }

            base.OnPreviewMouseMove(e);
        }

        #endregion
        #region PREVIEW 마우스 UP 처리하기 - OnPreviewMouseUp(e)

        /// <summary>
        /// PREVIEW 마우스 UP 처리하기
        /// </summary>
        /// <param name="e">이벤트 인자</param>
        protected override void OnPreviewMouseUp(MouseButtonEventArgs e)
        {
            if(IsMouseCaptured)
            {
                Cursor = Cursors.Arrow;

                ReleaseMouseCapture();
            }

            base.OnPreviewMouseUp(e);
        }

        #endregion

        ////////////////////////////////////////////////////////////////////////////////////////// Private
        //////////////////////////////////////////////////////////////////////////////// Function

        #region 스택 패널 구하기 - GetStackPanel(brush)

        /// <summary>
        /// 스택 패널 구하기
        /// </summary>
        /// <param name="brush">브러시</param>
        /// <returns>스택 패널</returns>
        private StackPanel GetStackPanel(SolidColorBrush brush)
        {
            StackPanel stackPanel = new StackPanel();

            stackPanel.Orientation = Orientation.Horizontal;

            for(int i = 0; i < 50; i++)
            {
                Rectangle rectangle = new Rectangle();

                rectangle.Width  = 100;
                rectangle.Height = 100;
                rectangle.Margin = new Thickness(5);
                rectangle.Fill   = i % 2 == 0 ? Brushes.LightGray : brush;

                stackPanel.Children.Add(rectangle);
            }

            return stackPanel;
        }

        #endregion
        #region 항목 컨트롤 데이터 설정하기 - SetItemsControlData()

        /// <summary>
        /// 항목 컨트롤 데이터 설정하기
        /// </summary>
        private void SetItemsControlData()
        {
            itemsControl.Items.Clear();

            itemsControl.Items.Add(GetStackPanel(Brushes.Red  ));
            itemsControl.Items.Add(GetStackPanel(Brushes.Green));
            itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));
            itemsControl.Items.Add(GetStackPanel(Brushes.Red  ));
            itemsControl.Items.Add(GetStackPanel(Brushes.Green));
            itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));
            itemsControl.Items.Add(GetStackPanel(Brushes.Red  ));
            itemsControl.Items.Add(GetStackPanel(Brushes.Green));
            itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));
            itemsControl.Items.Add(GetStackPanel(Brushes.Red  ));
            itemsControl.Items.Add(GetStackPanel(Brushes.Green));
            itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));
            itemsControl.Items.Add(GetStackPanel(Brushes.Red  ));
            itemsControl.Items.Add(GetStackPanel(Brushes.Green));
            itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

using System.Windows;

using System.Windows.Controls;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Shapes;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 스크롤 시작 포인트

/// </summary>

private Point scrollStartPoint;

/// <summary>

/// 스크롤 시작 오프셋

/// </summary>

private Point scrollStartOffset;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

SetItemsControlData();

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Protected

//////////////////////////////////////////////////////////////////////////////// Function

#region PREVIEW 마우스 DOWN 처리하기 - OnPreviewMouseDown(e)

/// <summary>

/// PREVIEW 마우스 DOWN 처리하기

/// </summary>

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

protected override void OnPreviewMouseDown(MouseButtonEventArgs e)

{

if(this.scrollViewer.IsMouseOver)

{

this.scrollStartPoint = e.GetPosition(this);

this.scrollStartOffset.X = this.scrollViewer.HorizontalOffset;

this.scrollStartOffset.Y = this.scrollViewer.VerticalOffset;

Cursor = (this.scrollViewer.ExtentWidth > this.scrollViewer.ViewportWidth ) ||

(this.scrollViewer.ExtentHeight > this.scrollViewer.ViewportHeight) ? Cursors.ScrollAll : Cursors.Arrow;

CaptureMouse();

}

base.OnPreviewMouseDown(e);

}

#endregion

#region PREVIEW 마우스 이동시 처리하기 - OnPreviewMouseMove(e)

/// <summary>

/// PREVIEW 마우스 이동시 처리하기

/// </summary>

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

protected override void OnPreviewMouseMove(MouseEventArgs e)

{

if(IsMouseCaptured)

{

Point mousePoint = e.GetPosition(this);

Point delta = new Point

(

(mousePoint.X > this.scrollStartPoint.X) ? -(mousePoint.X - this.scrollStartPoint.X) : (this.scrollStartPoint.X - mousePoint.X),

(mousePoint.Y > this.scrollStartPoint.Y) ? -(mousePoint.Y - this.scrollStartPoint.Y) : (this.scrollStartPoint.Y - mousePoint.Y)

);

this.scrollViewer.ScrollToHorizontalOffset(this.scrollStartOffset.X + delta.X);

this.scrollViewer.ScrollToVerticalOffset (this.scrollStartOffset.Y + delta.Y);

}

base.OnPreviewMouseMove(e);

}

#endregion

#region PREVIEW 마우스 UP 처리하기 - OnPreviewMouseUp(e)

/// <summary>

/// PREVIEW 마우스 UP 처리하기

/// </summary>

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

protected override void OnPreviewMouseUp(MouseButtonEventArgs e)

{

if(IsMouseCaptured)

{

Cursor = Cursors.Arrow;

ReleaseMouseCapture();

}

base.OnPreviewMouseUp(e);

}

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Function

#region 스택 패널 구하기 - GetStackPanel(brush)

/// <summary>

/// 스택 패널 구하기

/// </summary>

/// <param name="brush">브러시</param>

/// <returns>스택 패널</returns>

private StackPanel GetStackPanel(SolidColorBrush brush)

{

StackPanel stackPanel = new StackPanel();

stackPanel.Orientation = Orientation.Horizontal;

for(int i = 0; i < 50; i++)

{

Rectangle rectangle = new Rectangle();

rectangle.Width = 100;

rectangle.Height = 100;

rectangle.Margin = new Thickness(5);

rectangle.Fill = i % 2 == 0 ? Brushes.LightGray : brush;

stackPanel.Children.Add(rectangle);

}

return stackPanel;

}

#endregion

#region 항목 컨트롤 데이터 설정하기 - SetItemsControlData()

/// <summary>

/// 항목 컨트롤 데이터 설정하기

/// </summary>

private void SetItemsControlData()

{

itemsControl.Items.Clear();

itemsControl.Items.Add(GetStackPanel(Brushes.Red ));

itemsControl.Items.Add(GetStackPanel(Brushes.Green));

itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));

itemsControl.Items.Add(GetStackPanel(Brushes.Red ));

itemsControl.Items.Add(GetStackPanel(Brushes.Green));

itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));

itemsControl.Items.Add(GetStackPanel(Brushes.Red ));

itemsControl.Items.Add(GetStackPanel(Brushes.Green));

itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));

itemsControl.Items.Add(GetStackPanel(Brushes.Red ));

itemsControl.Items.Add(GetStackPanel(Brushes.Green));

itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));

itemsControl.Items.Add(GetStackPanel(Brushes.Red ));

itemsControl.Items.Add(GetStackPanel(Brushes.Green));

itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));

}

#endregion

}

TestProject.zip

[C#/WPF] ScrollViewer 클래스 : 마우스를 사용해 스크롤하기

■ ScrollViewer 클래스에서 마우스를 사용해 스크롤하는 방법을 보여준다. ▶ MouseCapture.cs


using System.Windows;

namespace TestProject
{
    /// <summary>
    /// 마우스 캡처
    /// </summary>
    public class MouseCapture
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 수직 오프셋 - VerticalOffset

        /// <summary>
        /// 수직 오프셋
        /// </summary>
        public double VerticalOffset { get; set; }

        #endregion
        #region 포인트 - Point

        /// <summary>
        /// 포인트
        /// </summary>
        public Point Point { get; set; }

        #endregion
    }
}

using System.Windows;

namespace TestProject

{

/// <summary>

/// 마우스 캡처

/// </summary>

public class MouseCapture

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 수직 오프셋 - VerticalOffset

/// <summary>

/// 수직 오프셋

/// </summary>

public double VerticalOffset { get; set; }

#endregion

#region 포인트 - Point

/// <summary>

/// 포인트

/// </summary>

public Point Point { get; set; }

#endregion

}

▶ MouseScrolling.cs


using System;
using System.Collections.Generic;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;

namespace TestProject
{
    /// <summary>
    /// 마우스 스크롤링
    /// </summary>
    public class MouseScrolling : DependencyObject
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 마우스 캡처 딕셔너리
        /// </summary>
        private static Dictionary<object, MouseCapture> _mouseCaptureDictionary = new Dictionary<object, MouseCapture>();

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Dependency Property
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 이용 가능 여부 첨부 속성 - IsEnabledProperty

        /// <summary>
        /// 이용 가능 여부 첨부 속성
        /// </summary>
        public static readonly DependencyProperty IsEnabledProperty = DependencyProperty.RegisterAttached
        (
            "IsEnabled",
            typeof(bool),
            typeof(MouseScrolling),
            new UIPropertyMetadata(false, IsEnabledPropertyChangedCallback)
        );

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Property
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 이용 가능 여부 - IsEnabled

        /// <summary>
        /// 이용 가능 여부
        /// </summary>
        public bool IsEnabled
        {
            get
            {
                return (bool)GetValue(IsEnabledProperty);
            }
            set
            {
                SetValue(IsEnabledProperty, value);
            }
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 이용 가능 여부 구하기 - GetIsEnabled(d)

        /// <summary>
        /// 이용 가능 여부 구하기
        /// </summary>
        /// <param name="d">의존 객체</param>
        /// <returns>이용 가능 여부</returns>
        public static bool GetIsEnabled(DependencyObject d)
        {
            return (bool)d.GetValue(IsEnabledProperty);
        }

        #endregion
        #region 이용 가능 여부 설정하기 - SetIsEnabled(d, value)

        /// <summary>
        /// 이용 가능 여부 설정하기
        /// </summary>
        /// <param name="d">의존 객체</param>
        /// <param name="value">값</param>
        public static void SetIsEnabled(DependencyObject d, bool value)
        {
            d.SetValue(IsEnabledProperty, value);
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////// Private
        ////////////////////////////////////////////////////////////////////// Event

        #region 이용 가능 여부 속성 변경시 콜백 처리하기 - IsEnabledPropertyChangedCallback(d, e)

        /// <summary>
        /// 이용 가능 여부 속성 변경시 콜백 처리하기
        /// </summary>
        /// <param name="d">의존 객체</param>
        /// <param name="e">이벤트 인자</param>
        private static void IsEnabledPropertyChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            ScrollViewer scrollViewer = d as ScrollViewer;

            if(scrollViewer == null)
            {
                return;
            }

            if((bool)e.NewValue)
            {
                scrollViewer.Loaded += scrollViewer_Loaded;
            }
            else
            {
                scrollViewer_Unloaded(scrollViewer, new RoutedEventArgs());
            }
        }

        #endregion

        #region 스크롤 뷰어 로드시 처리하기 - scrollViewer_Loaded(sender, e)

        /// <summary>
        /// 스크롤 뷰어 로드시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private static void scrollViewer_Loaded(object sender, RoutedEventArgs e)
        {
            ScrollViewer scrollViewer = sender as ScrollViewer;

            if(scrollViewer == null)
            {
                return;
            }

            scrollViewer.Unloaded                   += scrollViewer_Unloaded;
            scrollViewer.PreviewMouseLeftButtonDown += scrollViewer_PreviewMouseLeftButtonDown;
            scrollViewer.PreviewMouseMove           += scrollViewer_PreviewMouseMove;
            scrollViewer.PreviewMouseLeftButtonUp   += scrollViewer_PreviewMouseLeftButtonUp;
        }

        #endregion
        #region 스크롤 뷰어 언로드시 처리하기 - scrollViewer_Unloaded(sender, e)

        /// <summary>
        /// 스크롤 뷰어 언로드시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private static void scrollViewer_Unloaded(object sender, RoutedEventArgs e)
        {
            ScrollViewer scrollViewer = sender as ScrollViewer;

            if(scrollViewer == null)
            {
                return;
            }

            _mouseCaptureDictionary.Remove(sender);

            scrollViewer.Loaded                     -= scrollViewer_Loaded;
            scrollViewer.Unloaded                   -= scrollViewer_Unloaded;
            scrollViewer.PreviewMouseLeftButtonDown -= scrollViewer_PreviewMouseLeftButtonDown;
            scrollViewer.PreviewMouseMove           -= scrollViewer_PreviewMouseMove;
            scrollViewer.PreviewMouseLeftButtonUp   -= scrollViewer_PreviewMouseLeftButtonUp;
        }

        #endregion
        #region 스크롤 뷰어 PREVIEW 마우스 왼쪽 버튼 DOWN 처리하기 - scrollViewer_PreviewMouseLeftButtonDown(sender, e)

        /// <summary>
        /// 스크롤 뷰어 PREVIEW 마우스 왼쪽 버튼 DOWN 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private static void scrollViewer_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            ScrollViewer scrollViewer = e.OriginalSource as ScrollViewer;

            if(scrollViewer == null)
            {
                return;
            }

            _mouseCaptureDictionary[sender] = new MouseCapture
            {
                VerticalOffset = scrollViewer.VerticalOffset,
                Point          = e.GetPosition(scrollViewer)
            };
        }

        #endregion
        #region 스크롤 뷰어 PREVIEW 마우스 이동시 처리하기 - scrollViewer_PreviewMouseMove(sender, e)

        /// <summary>
        /// 스크롤 뷰어 PREVIEW 마우스 이동시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private static void scrollViewer_PreviewMouseMove(object sender, MouseEventArgs e)
        {
            if(!_mouseCaptureDictionary.ContainsKey(sender))
            {
                return;
            }

            if(e.LeftButton != MouseButtonState.Pressed)
            {
                _mouseCaptureDictionary.Remove(sender);

                return;
            }

            ScrollViewer scrollViewer = sender as ScrollViewer;

            if(scrollViewer == null)
            {
                return;
            }

            MouseCapture mouseCapture = _mouseCaptureDictionary[sender];

            Point point = e.GetPosition(scrollViewer);

            double deltaY = point.Y - mouseCapture.Point.Y;

            if(Math.Abs(deltaY) > 5)
            {
                scrollViewer.CaptureMouse();
            }

            scrollViewer.ScrollToVerticalOffset(mouseCapture.VerticalOffset - deltaY);
        }

        #endregion
        #region 스크롤 뷰어 PREVIEW 마우스 왼쪽 버튼 UP 처리하기 - scrollViewer_PreviewMouseLeftButtonUp(sender, e)

        /// <summary>
        /// 스크롤 뷰어 PREVIEW 마우스 왼쪽 버튼 UP 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private static void scrollViewer_PreviewMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
        {
            ScrollViewer srollViewer = sender as ScrollViewer;

            if(srollViewer == null)
            {
                return;
            }

            srollViewer.ReleaseMouseCapture();
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

using System;

using System.Collections.Generic;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Input;

namespace TestProject

{

/// <summary>

/// 마우스 스크롤링

/// </summary>

public class MouseScrolling : DependencyObject

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 마우스 캡처 딕셔너리

/// </summary>

private static Dictionary<object, MouseCapture> _mouseCaptureDictionary = new Dictionary<object, MouseCapture>();

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Dependency Property

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 이용 가능 여부 첨부 속성 - IsEnabledProperty

/// <summary>

/// 이용 가능 여부 첨부 속성

/// </summary>

public static readonly DependencyProperty IsEnabledProperty = DependencyProperty.RegisterAttached

(

"IsEnabled",

typeof(bool),

typeof(MouseScrolling),

new UIPropertyMetadata(false, IsEnabledPropertyChangedCallback)

);

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 이용 가능 여부 - IsEnabled

/// <summary>

/// 이용 가능 여부

/// </summary>

public bool IsEnabled

{

get

{

return (bool)GetValue(IsEnabledProperty);

}

set

{

SetValue(IsEnabledProperty, value);

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 이용 가능 여부 구하기 - GetIsEnabled(d)

/// <summary>

/// 이용 가능 여부 구하기

/// </summary>

/// <param name="d">의존 객체</param>

/// <returns>이용 가능 여부</returns>

public static bool GetIsEnabled(DependencyObject d)

{

return (bool)d.GetValue(IsEnabledProperty);

}

#endregion

#region 이용 가능 여부 설정하기 - SetIsEnabled(d, value)

/// <summary>

/// 이용 가능 여부 설정하기

/// </summary>

/// <param name="d">의존 객체</param>

/// <param name="value">값</param>

public static void SetIsEnabled(DependencyObject d, bool value)

{

d.SetValue(IsEnabledProperty, value);

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Private

////////////////////////////////////////////////////////////////////// Event

#region 이용 가능 여부 속성 변경시 콜백 처리하기 - IsEnabledPropertyChangedCallback(d, e)

/// <summary>

/// 이용 가능 여부 속성 변경시 콜백 처리하기

/// </summary>

/// <param name="d">의존 객체</param>

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

private static void IsEnabledPropertyChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)

{

ScrollViewer scrollViewer = d as ScrollViewer;

if(scrollViewer == null)

{

return;

}

if((bool)e.NewValue)

{

scrollViewer.Loaded += scrollViewer_Loaded;

}

else

{

scrollViewer_Unloaded(scrollViewer, new RoutedEventArgs());

}

#endregion

#region 스크롤 뷰어 로드시 처리하기 - scrollViewer_Loaded(sender, e)

/// <summary>

/// 스크롤 뷰어 로드시 처리하기

/// </summary>

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

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

private static void scrollViewer_Loaded(object sender, RoutedEventArgs e)

{

ScrollViewer scrollViewer = sender as ScrollViewer;

if(scrollViewer == null)

{

return;

}

scrollViewer.Unloaded += scrollViewer_Unloaded;

scrollViewer.PreviewMouseLeftButtonDown += scrollViewer_PreviewMouseLeftButtonDown;

scrollViewer.PreviewMouseMove += scrollViewer_PreviewMouseMove;

scrollViewer.PreviewMouseLeftButtonUp += scrollViewer_PreviewMouseLeftButtonUp;

}

#endregion

#region 스크롤 뷰어 언로드시 처리하기 - scrollViewer_Unloaded(sender, e)

/// <summary>

/// 스크롤 뷰어 언로드시 처리하기

/// </summary>

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

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

private static void scrollViewer_Unloaded(object sender, RoutedEventArgs e)

{

ScrollViewer scrollViewer = sender as ScrollViewer;

if(scrollViewer == null)

{

return;

}

_mouseCaptureDictionary.Remove(sender);

scrollViewer.Loaded -= scrollViewer_Loaded;

scrollViewer.Unloaded -= scrollViewer_Unloaded;

scrollViewer.PreviewMouseLeftButtonDown -= scrollViewer_PreviewMouseLeftButtonDown;

scrollViewer.PreviewMouseMove -= scrollViewer_PreviewMouseMove;

scrollViewer.PreviewMouseLeftButtonUp -= scrollViewer_PreviewMouseLeftButtonUp;

}

#endregion

#region 스크롤 뷰어 PREVIEW 마우스 왼쪽 버튼 DOWN 처리하기 - scrollViewer_PreviewMouseLeftButtonDown(sender, e)

/// <summary>

/// 스크롤 뷰어 PREVIEW 마우스 왼쪽 버튼 DOWN 처리하기

/// </summary>

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

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

private static void scrollViewer_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)

{

ScrollViewer scrollViewer = e.OriginalSource as ScrollViewer;

if(scrollViewer == null)

{

return;

}

_mouseCaptureDictionary[sender] = new MouseCapture

{

VerticalOffset = scrollViewer.VerticalOffset,

Point = e.GetPosition(scrollViewer)

};

}

#endregion

#region 스크롤 뷰어 PREVIEW 마우스 이동시 처리하기 - scrollViewer_PreviewMouseMove(sender, e)

/// <summary>

/// 스크롤 뷰어 PREVIEW 마우스 이동시 처리하기

/// </summary>

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

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

private static void scrollViewer_PreviewMouseMove(object sender, MouseEventArgs e)

{

if(!_mouseCaptureDictionary.ContainsKey(sender))

{

return;

}

if(e.LeftButton != MouseButtonState.Pressed)

{

_mouseCaptureDictionary.Remove(sender);

return;

}

ScrollViewer scrollViewer = sender as ScrollViewer;

if(scrollViewer == null)

{

return;

}

MouseCapture mouseCapture = _mouseCaptureDictionary[sender];

Point point = e.GetPosition(scrollViewer);

double deltaY = point.Y - mouseCapture.Point.Y;

if(Math.Abs(deltaY) > 5)

{

scrollViewer.CaptureMouse();

}

scrollViewer.ScrollToVerticalOffset(mouseCapture.VerticalOffset - deltaY);

}

#endregion

#region 스크롤 뷰어 PREVIEW 마우스 왼쪽 버튼 UP 처리하기 - scrollViewer_PreviewMouseLeftButtonUp(sender, e)

/// <summary>

/// 스크롤 뷰어 PREVIEW 마우스 왼쪽 버튼 UP 처리하기

/// </summary>

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

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

private static void scrollViewer_PreviewMouseLeftButtonUp(object sender, MouseButtonEventArgs e)

{

ScrollViewer srollViewer = sender as ScrollViewer;

if(srollViewer == null)

{

return;

}

srollViewer.ReleaseMouseCapture();

}

#endregion

}

▶ MainWindow.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:TestProject"
    Width="800"
    Height="600"
    Title="ScrollViewer 클래스 : 마우스를 사용해 스크롤하기"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Window.Resources>
        <Style TargetType="Ellipse">
            <Setter Property="Width"  Value="100" />
            <Setter Property="Height" Value="100" />
        </Style>
    </Window.Resources>
    <Grid>
        <ScrollViewer
            VerticalScrollBarVisibility="Auto"
            local:MouseScrolling.IsEnabled="True">
            <Canvas
                Width="740"
                Height="1200">
                <Ellipse Canvas.Left="100"  Canvas.Top="100"  Fill="Red"   />
                <Ellipse Canvas.Left="200"  Canvas.Top="200"  Fill="Green" />
                <Ellipse Canvas.Left="300"  Canvas.Top="300"  Fill="Blue"  />
                <Ellipse Canvas.Left="200"  Canvas.Top="400"  Fill="Red"   />
                <Ellipse Canvas.Left="100"  Canvas.Top="500"  Fill="Green" />
                <Ellipse Canvas.Left="200"  Canvas.Top="600"  Fill="Blue"  />
                <Ellipse Canvas.Left="300"  Canvas.Top="700"  Fill="Red"   />
                <Ellipse Canvas.Left="200"  Canvas.Top="800"  Fill="Green" />
                <Ellipse Canvas.Left="100"  Canvas.Top="900"  Fill="Blue"  />
                <Ellipse Canvas.Left="200"  Canvas.Top="1000" Fill="Red"   />
            </Canvas>
        </ScrollViewer>
    </Grid>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:local="clr-namespace:TestProject"

Width="800"

Height="600"

Title="ScrollViewer 클래스 : 마우스를 사용해 스크롤하기"

FontFamily="나눔고딕코딩"

FontSize="16">

<Window.Resources>

</Style>

</Window.Resources>

<Grid>

<ScrollViewer

VerticalScrollBarVisibility="Auto"

local:MouseScrolling.IsEnabled="True">

<Canvas

Width="740"

Height="1200">

</Canvas>

</ScrollViewer>

</Grid>

</Window>

TestProject.zip

[C#/WPF] ScrollBar 엘리먼트 : 색상 스크롤하기

■ ScrollBar 엘리먼트를 사용해 색상을 스크롤하는 방법을 보여준다. ▶ MainWindow.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="ScrollBar 엘리먼트 : 색상 스크롤하기"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Grid>
        <Grid Margin="10">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="200"  />
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="*"    />
            </Grid.ColumnDefinitions>
            <Grid Grid.Row="0" Grid.Column="0">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="*"    />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Label Grid.Row="0" Grid.Column="0"
                    HorizontalAlignment="Center"
                    Margin="10"
                    Content="적색" />
                <ScrollBar Name="redScrollBar" Grid.Row="1" Grid.Column="0"
                    Margin="10"
                    Orientation="Vertical"
                    Focusable="True"
                    Minimum="0"
                    Maximum="255"
                    SmallChange="1"
                    LargeChange="16" />
                <TextBlock Name="redTextBlock" Grid.Row="2" Grid.Column="0"
                    HorizontalAlignment="Center"
                    Margin="10"
                    TextAlignment="Center" />
                <Label Grid.Row="0" Grid.Column="1"
                    HorizontalAlignment="Center"
                    Margin="10"
                    Content="녹색" />
                <ScrollBar Name="greenScrollBar" Grid.Row="1" Grid.Column="1"
                    Margin="10"
                    Orientation="Vertical"
                    Focusable="True"
                    Minimum="0"
                    Maximum="255"
                    SmallChange="1"
                    LargeChange="16" />
                <TextBlock Name="greenTextBlock" Grid.Row="2" Grid.Column="1"
                    HorizontalAlignment="Center"
                    Margin="10"
                    TextAlignment="Center" />
                <Label Grid.Row="0" Grid.Column="2"
                    HorizontalAlignment="Center"
                    Margin="10"
                    Content="청색" />
                <ScrollBar Name="blueScrollBar" Grid.Row="1" Grid.Column="2"
                    Margin="10"
                    Orientation="Vertical"
                    Focusable="True"
                    Minimum="0"
                    Maximum="255"
                    SmallChange="1"
                    LargeChange="16" />
                <TextBlock Name="blueTextBlock" Grid.Row="2" Grid.Column="3"
                    HorizontalAlignment="Center"
                    Margin="10"
                    TextAlignment="Center" />
            </Grid>
            <GridSplitter Grid.Row="0" Grid.Column="1"
                HorizontalAlignment="Center"
                VerticalAlignment="Stretch"
                Width="10" />
            <StackPanel Name="stackPanel" Grid.Row="0" Grid.Column="2"
                Background="{StaticResource {x:Static SystemColors.WindowBrushKey}}" />
        </Grid>
    </Grid>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="800"

Height="600"

Title="ScrollBar 엘리먼트 : 색상 스크롤하기"

FontFamily="나눔고딕코딩"

FontSize="16">

<Grid>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<Label Grid.Row="0" Grid.Column="0"

HorizontalAlignment="Center"

Margin="10"

Content="적색" />

<ScrollBar Name="redScrollBar" Grid.Row="1" Grid.Column="0"

Margin="10"

Orientation="Vertical"

Focusable="True"

Minimum="0"

Maximum="255"

SmallChange="1"

LargeChange="16" />

<TextBlock Name="redTextBlock" Grid.Row="2" Grid.Column="0"

HorizontalAlignment="Center"

Margin="10"

TextAlignment="Center" />

<Label Grid.Row="0" Grid.Column="1"

HorizontalAlignment="Center"

Margin="10"

Content="녹색" />

<ScrollBar Name="greenScrollBar" Grid.Row="1" Grid.Column="1"

Margin="10"

Orientation="Vertical"

Focusable="True"

Minimum="0"

Maximum="255"

SmallChange="1"

LargeChange="16" />

<TextBlock Name="greenTextBlock" Grid.Row="2" Grid.Column="1"

HorizontalAlignment="Center"

Margin="10"

TextAlignment="Center" />

<Label Grid.Row="0" Grid.Column="2"

HorizontalAlignment="Center"

Margin="10"

Content="청색" />

<ScrollBar Name="blueScrollBar" Grid.Row="1" Grid.Column="2"

Margin="10"

Orientation="Vertical"

Focusable="True"

Minimum="0"

Maximum="255"

SmallChange="1"

LargeChange="16" />

<TextBlock Name="blueTextBlock" Grid.Row="2" Grid.Column="3"

HorizontalAlignment="Center"

Margin="10"

TextAlignment="Center" />

</Grid>

<GridSplitter Grid.Row="0" Grid.Column="1"

HorizontalAlignment="Center"

VerticalAlignment="Stretch"

Width="10" />

<StackPanel Name="stackPanel" Grid.Row="0" Grid.Column="2"

Background="{StaticResource {x:Static SystemColors.WindowBrushKey}}" />

</Grid>

</Window>

▶ MainWindow.xaml.cs


using System.Windows;
using System.Windows.Controls;
using System.Windows.Controls.Primitives;
using System.Windows.Media;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            Loaded                           += Window_Loaded;
            this.redScrollBar.ValueChanged   += colorScrollBar_ValueChanged;
            this.greenScrollBar.ValueChanged += colorScrollBar_ValueChanged;
            this.blueScrollBar.ValueChanged  += colorScrollBar_ValueChanged;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region 윈도우 로드시 처리하기 - Window_Loaded(sender, e)

        /// <summary>
        /// 윈도우 로드시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            Color color = (this.stackPanel.Background as SolidColorBrush).Color;

            this.redScrollBar.Value   = color.R;
            this.greenScrollBar.Value = color.G;
            this.blueScrollBar.Value  = color.B;

            this.redScrollBar.Focus();
        }

        #endregion
        #region 색상 스크롤바 값 변경시 처리하기 - colorScrollBar_ValueChanged(sender, e)

        /// <summary>
        /// 색상 스크롤바 값 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void colorScrollBar_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            ScrollBar scrollBar = sender as ScrollBar;

            Panel panel = scrollBar.Parent as Panel;

            TextBlock textBlock;

            if(scrollBar == this.redScrollBar)
            {
                textBlock = this.redTextBlock;
            }
            else if(scrollBar == this.greenScrollBar)
            {
                textBlock = this.greenTextBlock;
            }
            else
            {
                textBlock = this.blueTextBlock;
            }

            textBlock.Text = string.Format("{0}\n0x{0:X2}", (int)scrollBar.Value);

            this.stackPanel.Background = new SolidColorBrush
            (
                Color.FromRgb
                (
                    (byte)redScrollBar.Value,
                    (byte)greenScrollBar.Value,
                    (byte)blueScrollBar.Value
                )
            );
        }

        #endregion
    }
}

100

using System.Windows;

using System.Windows.Controls;

using System.Windows.Controls.Primitives;

using System.Windows.Media;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

Loaded += Window_Loaded;

this.redScrollBar.ValueChanged += colorScrollBar_ValueChanged;

this.greenScrollBar.ValueChanged += colorScrollBar_ValueChanged;

this.blueScrollBar.ValueChanged += colorScrollBar_ValueChanged;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 윈도우 로드시 처리하기 - Window_Loaded(sender, e)

/// <summary>

/// 윈도우 로드시 처리하기

/// </summary>

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

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

private void Window_Loaded(object sender, RoutedEventArgs e)

{

Color color = (this.stackPanel.Background as SolidColorBrush).Color;

this.redScrollBar.Value = color.R;

this.greenScrollBar.Value = color.G;

this.blueScrollBar.Value = color.B;

this.redScrollBar.Focus();

}

#endregion

#region 색상 스크롤바 값 변경시 처리하기 - colorScrollBar_ValueChanged(sender, e)

/// <summary>

/// 색상 스크롤바 값 변경시 처리하기

/// </summary>

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

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

private void colorScrollBar_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)

{

ScrollBar scrollBar = sender as ScrollBar;

Panel panel = scrollBar.Parent as Panel;

TextBlock textBlock;

if(scrollBar == this.redScrollBar)

{

textBlock = this.redTextBlock;

}

else if(scrollBar == this.greenScrollBar)

{

textBlock = this.greenTextBlock;

}

else

{

textBlock = this.blueTextBlock;

}

textBlock.Text = string.Format("{0}\n0x{0:X2}", (int)scrollBar.Value);

this.stackPanel.Background = new SolidColorBrush

(

Color.FromRgb

(

(byte)redScrollBar.Value,

(byte)greenScrollBar.Value,

(byte)blueScrollBar.Value

)

);

}

#endregion

}

TestProject.zip

[C#/WPF] ScrollViewer 클래스 : 마우스를 사용해 스크롤하기

■ ScrollViewer 클래스에서 마우스를 사용해 스크롤을 하는 방법을 보여준다. ▶ MainWindow.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="ScrollViewer 클래스 : 마우스를 사용해 스크롤하기">
    <Window.Resources>
        <Style x:Key="ScrollViewerStyleKey" TargetType="{x:Type ScrollViewer}">
            <Setter Property="HorizontalScrollBarVisibility" Value="Hidden" />
            <Setter Property="VerticalScrollBarVisibility"   Value="Hidden" />
        </Style>
    </Window.Resources>
    <Grid Margin="0">
        <ScrollViewer Name="scrollViewer" Style="{StaticResource ScrollViewerStyleKey}">
            <ItemsControl Name="itemsControl" VerticalAlignment="Center">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Vertical" />
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
            </ItemsControl>
        </ScrollViewer>
    </Grid>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="800"

Height="600"

Title="ScrollViewer 클래스 : 마우스를 사용해 스크롤하기">

<Window.Resources>

</Style>

</Window.Resources>

<ItemsControl.ItemsPanel>

</ItemsPanelTemplate>

</ItemsControl.ItemsPanel>

</ItemsControl>

</ScrollViewer>

</Grid>

</Window>

▶ MainWindow.xaml.cs


using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Shapes;
using System.Windows.Threading;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 마찰 저항
        /// </summary>
        private double friction;

        /// <summary>
        /// 디스패처 타이머
        /// </summary>
        private DispatcherTimer dispatcherTimer = new DispatcherTimer();

        /// <summary>
        /// 속도
        /// </summary>
        private Vector velocity;

        /// <summary>
        /// 이전 포인트
        /// </summary>
        private Point previousPoint;

        /// <summary>
        /// 스크롤 타겟 포인트
        /// </summary>
        private Point scrollTargetPoint;

        /// <summary>
        /// 스크롤 시작 포인트
        /// </summary>
        private Point scrollStartPoint;

        /// <summary>
        /// 스크롤 시작 오프셋
        /// </summary>
        private Point scrollStartOffset;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            SetItemsControlData();

            this.friction = 0.95;

            this.dispatcherTimer = new DispatcherTimer();

            this.dispatcherTimer.Interval = new TimeSpan(0, 0, 0, 0, 20);

            this.dispatcherTimer.Tick += dispatcherTimer_Tick;

            this.dispatcherTimer.Start();
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Protected
        //////////////////////////////////////////////////////////////////////////////// Function

        #region 마우스 DOWN PREVIEW 처리하기 - OnPreviewMouseDown(e)

        /// <summary>
        /// 마우스 DOWN PREVIEW 처리하기
        /// </summary>
        /// <param name="e">이벤트 인자</param>
        protected override void OnPreviewMouseDown(MouseButtonEventArgs e)
        {
            if(this.scrollViewer.IsMouseOver)
            {
                this.scrollStartPoint = e.GetPosition(this);

                this.scrollStartOffset.X = this.scrollViewer.HorizontalOffset;
                this.scrollStartOffset.Y = this.scrollViewer.VerticalOffset;

                Cursor = (this.scrollViewer.ExtentWidth > scrollViewer.ViewportWidth) ||
                    (scrollViewer.ExtentHeight > scrollViewer.ViewportHeight) ? Cursors.ScrollAll : Cursors.Arrow;

                CaptureMouse();
            }

            base.OnPreviewMouseDown(e);
        }

        #endregion
        #region 마우스 이동시 PREVIEW 처리하기 - OnPreviewMouseMove(e)

        /// <summary>
        /// 마우스 이동시 PREVIEW 처리하기
        /// </summary>
        /// <param name="e">이벤트 인자</param>
        protected override void OnPreviewMouseMove(MouseEventArgs e)
        {
            if(IsMouseCaptured)
            {
                Point mousePoint = e.GetPosition(this);

                Point deltaPoint = new Point(this.scrollStartPoint.X - mousePoint.X, this.scrollStartPoint.Y - mousePoint.Y);

                this.scrollTargetPoint.X = this.scrollStartOffset.X + deltaPoint.X;
                this.scrollTargetPoint.Y = this.scrollStartOffset.Y + deltaPoint.Y;

                this.scrollViewer.ScrollToHorizontalOffset(this.scrollTargetPoint.X);
                this.scrollViewer.ScrollToVerticalOffset  (this.scrollTargetPoint.Y);
            }

            base.OnPreviewMouseMove(e);
        }

        #endregion
        #region 마우스 UP PREVIEW 처리하기 - OnPreviewMouseUp(e)

        /// <summary>
        /// 마우스 UP PREVIEW 처리하기
        /// </summary>
        /// <param name="e">이벤트 인자</param>
        protected override void OnPreviewMouseUp(MouseButtonEventArgs e)
        {
            if(IsMouseCaptured)
            {
                Cursor = Cursors.Arrow;

                ReleaseMouseCapture();
            }

            base.OnPreviewMouseUp(e);
        }

        #endregion

        ////////////////////////////////////////////////////////////////////////////////////////// Private
        //////////////////////////////////////////////////////////////////////////////// Event

        #region 디스패처 타이머 틱 처리하기 - dispatcherTimer_Tick(sender, e)

        /// <summary>
        /// 디스패처 타이머 틱 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void dispatcherTimer_Tick(object sender, EventArgs e)
        {
            if(IsMouseCaptured)
            {
                Point mousePoint = Mouse.GetPosition(this);

                this.velocity = this.previousPoint - mousePoint;

                this.previousPoint = mousePoint;
            }
            else
            {
                if(this.velocity.Length > 1)
                {
                    this.scrollViewer.ScrollToHorizontalOffset(this.scrollTargetPoint.X);
                    this.scrollViewer.ScrollToVerticalOffset  (this.scrollTargetPoint.Y);

                    this.scrollTargetPoint.X += this.velocity.X;
                    this.scrollTargetPoint.Y += this.velocity.Y;

                    this.velocity *= this.friction;
                }
            }
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////// Function

        #region 스택 패널 구하기 - GetStackPanel(brush)

        /// <summary>
        /// 스택 패널 구하기
        /// </summary>
        /// <param name="brush">브러시</param>
        /// <returns>스택 패널</returns>
        private StackPanel GetStackPanel(SolidColorBrush brush)
        {
            StackPanel stackPanel = new StackPanel();

            stackPanel.Orientation = Orientation.Horizontal;

            for(int i = 0; i < 50; i++)
            {
                Rectangle rectangle = new Rectangle();

                rectangle.Width  = 100;
                rectangle.Height = 100;
                rectangle.Margin = new Thickness(5);
                rectangle.Fill   = i % 2 == 0 ? Brushes.LightGray : brush;

                stackPanel.Children.Add(rectangle);
            }

            return stackPanel;
        }

        #endregion
        #region 항목 컨트롤 데이터 설정하기 - SetItemsControlData()

        /// <summary>
        /// 항목 컨트롤 데이터 설정하기
        /// </summary>
        private void SetItemsControlData()
        {
            this.itemsControl.Items.Clear();

            this.itemsControl.Items.Add(GetStackPanel(Brushes.Red  ));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Green));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Red  ));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Green));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Red  ));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Green));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Red  ));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Green));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Red  ));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Green));
            this.itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

using System;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Shapes;

using System.Windows.Threading;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 마찰 저항

/// </summary>

private double friction;

/// <summary>

/// 디스패처 타이머

/// </summary>

private DispatcherTimer dispatcherTimer = new DispatcherTimer();

/// <summary>

/// 속도

/// </summary>

private Vector velocity;

/// <summary>

/// 이전 포인트

/// </summary>

private Point previousPoint;

/// <summary>

/// 스크롤 타겟 포인트

/// </summary>

private Point scrollTargetPoint;

/// <summary>

/// 스크롤 시작 포인트

/// </summary>

private Point scrollStartPoint;

/// <summary>

/// 스크롤 시작 오프셋

/// </summary>

private Point scrollStartOffset;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

SetItemsControlData();

this.friction = 0.95;

this.dispatcherTimer = new DispatcherTimer();

this.dispatcherTimer.Interval = new TimeSpan(0, 0, 0, 0, 20);

this.dispatcherTimer.Tick += dispatcherTimer_Tick;

this.dispatcherTimer.Start();

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Protected

//////////////////////////////////////////////////////////////////////////////// Function

#region 마우스 DOWN PREVIEW 처리하기 - OnPreviewMouseDown(e)

/// <summary>

/// 마우스 DOWN PREVIEW 처리하기

/// </summary>

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

protected override void OnPreviewMouseDown(MouseButtonEventArgs e)

{

if(this.scrollViewer.IsMouseOver)

{

this.scrollStartPoint = e.GetPosition(this);

this.scrollStartOffset.X = this.scrollViewer.HorizontalOffset;

this.scrollStartOffset.Y = this.scrollViewer.VerticalOffset;

Cursor = (this.scrollViewer.ExtentWidth > scrollViewer.ViewportWidth) ||

(scrollViewer.ExtentHeight > scrollViewer.ViewportHeight) ? Cursors.ScrollAll : Cursors.Arrow;

CaptureMouse();

}

base.OnPreviewMouseDown(e);

}

#endregion

#region 마우스 이동시 PREVIEW 처리하기 - OnPreviewMouseMove(e)

/// <summary>

/// 마우스 이동시 PREVIEW 처리하기

/// </summary>

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

protected override void OnPreviewMouseMove(MouseEventArgs e)

{

if(IsMouseCaptured)

{

Point mousePoint = e.GetPosition(this);

Point deltaPoint = new Point(this.scrollStartPoint.X - mousePoint.X, this.scrollStartPoint.Y - mousePoint.Y);

this.scrollTargetPoint.X = this.scrollStartOffset.X + deltaPoint.X;

this.scrollTargetPoint.Y = this.scrollStartOffset.Y + deltaPoint.Y;

this.scrollViewer.ScrollToHorizontalOffset(this.scrollTargetPoint.X);

this.scrollViewer.ScrollToVerticalOffset (this.scrollTargetPoint.Y);

}

base.OnPreviewMouseMove(e);

}

#endregion

#region 마우스 UP PREVIEW 처리하기 - OnPreviewMouseUp(e)

/// <summary>

/// 마우스 UP PREVIEW 처리하기

/// </summary>

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

protected override void OnPreviewMouseUp(MouseButtonEventArgs e)

{

if(IsMouseCaptured)

{

Cursor = Cursors.Arrow;

ReleaseMouseCapture();

}

base.OnPreviewMouseUp(e);

}

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Event

#region 디스패처 타이머 틱 처리하기 - dispatcherTimer_Tick(sender, e)

/// <summary>

/// 디스패처 타이머 틱 처리하기

/// </summary>

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

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

private void dispatcherTimer_Tick(object sender, EventArgs e)

{

if(IsMouseCaptured)

{

Point mousePoint = Mouse.GetPosition(this);

this.velocity = this.previousPoint - mousePoint;

this.previousPoint = mousePoint;

}

else

{

if(this.velocity.Length > 1)

{

this.scrollViewer.ScrollToHorizontalOffset(this.scrollTargetPoint.X);

this.scrollViewer.ScrollToVerticalOffset (this.scrollTargetPoint.Y);

this.scrollTargetPoint.X += this.velocity.X;

this.scrollTargetPoint.Y += this.velocity.Y;

this.velocity *= this.friction;

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Function

#region 스택 패널 구하기 - GetStackPanel(brush)

/// <summary>

/// 스택 패널 구하기

/// </summary>

/// <param name="brush">브러시</param>

/// <returns>스택 패널</returns>

private StackPanel GetStackPanel(SolidColorBrush brush)

{

StackPanel stackPanel = new StackPanel();

stackPanel.Orientation = Orientation.Horizontal;

for(int i = 0; i < 50; i++)

{

Rectangle rectangle = new Rectangle();

rectangle.Width = 100;

rectangle.Height = 100;

rectangle.Margin = new Thickness(5);

rectangle.Fill = i % 2 == 0 ? Brushes.LightGray : brush;

stackPanel.Children.Add(rectangle);

}

return stackPanel;

}

#endregion

#region 항목 컨트롤 데이터 설정하기 - SetItemsControlData()

/// <summary>

/// 항목 컨트롤 데이터 설정하기

/// </summary>

private void SetItemsControlData()

{

this.itemsControl.Items.Clear();

this.itemsControl.Items.Add(GetStackPanel(Brushes.Red ));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Green));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Red ));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Green));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Red ));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Green));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Red ));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Green));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Red ));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Green));

this.itemsControl.Items.Add(GetStackPanel(Brushes.Blue ));

}

#endregion

}

TestProject.zip

[C#/WPF] ScrollViewer 클래스 : IsDeferredScrollingEnabled 속성을 사용해 스크롤 성능 높이기

■ ScrollViewer 클래스의 IsDeferredScrollingEnabled 속성을 사용해 스크롤 성능을 높이는 방법을 보여준다. ▶ MainWindow.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="ScrollViewer 클래스 : IsDeferredScrollingEnabled 속성을 사용해 스크롤 성능 높이기"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <ScrollViewer IsDeferredScrollingEnabled="True">
        <StackPanel Name="stackPanel">
            <Button Margin="10" Height="100" Background="Red"   Content="버튼 1" />
            <Button Margin="10" Height="100" Background="Green" Content="버튼 2" />
            <Button Margin="10" Height="100" Background="Blue"  Content="버튼 3" />
            <Button Margin="10" Height="100" Background="Red"   Content="버튼 4" />
            <Button Margin="10" Height="100" Background="Green" Content="버튼 5" />
            <Button Margin="10" Height="100" Background="Blue"  Content="버튼 6" />
            <Button Margin="10" Height="100" Background="Red"   Content="버튼 7" />
            <Button Margin="10" Height="100" Background="Green" Content="버튼 8" />
            <Button Margin="10" Height="100" Background="Blue"  Content="버튼 9" />
        </StackPanel>
    </ScrollViewer>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="800"

Height="600"

Title="ScrollViewer 클래스 : IsDeferredScrollingEnabled 속성을 사용해 스크롤 성능 높이기"

FontFamily="나눔고딕코딩"

FontSize="16">

</StackPanel>

</ScrollViewer>

</Window>

TestProject.zip

[C#/WPF] ScrollViewer 클래스 : 시프트 키와 마우스 휠을 사용해 가로 스크롤 처리하기

■ ScrollViewer 클래스에서 시프트 키와 마우스 휠을 사용해 가로 스크롤을 처리하는 방법을 보여준다. ▶ ScrollViewerHelper.cs


using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;

namespace TestProject
{
    /// <summary>
    /// 스크롤 뷰어 헬퍼
    /// </summary>
    public static class ScrollViewerHelper
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 시프트/휠 사용 여부 속성
        /// </summary>
        public static readonly DependencyProperty UseShiftWheelProperty = DependencyProperty.RegisterAttached
        (
            "UseShiftWheel",
            typeof(bool),
            typeof(ScrollViewerHelper),
            new PropertyMetadata(false, UseShiftWheelPropertyChangedCallback)
        );

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Static
        //////////////////////////////////////////////////////////////////////////////// Public

        #region 시프트/휠 사용 여부 설정하기 - SetUseShiftWheel(uiElement, value)

        /// <summary>
        /// 시프트/휠 사용 여부 설정하기
        /// </summary>
        /// <param name="uiElement">UI 엘리먼트</param>
        /// <param name="value">값</param>
        public static void SetUseShiftWheel(UIElement uiElement, bool value) => uiElement.SetValue(UseShiftWheelProperty, value);

        #endregion
        #region 시프트/휠 사용 여부 구하기 - GetUseShiftWheel(uiElement)

        /// <summary>
        /// 시프트/휠 사용 여부 구하기
        /// </summary>
        /// <param name="uiElement">UI 엘리먼트</param>
        /// <returns>시프트/휠 사용 여부</returns>
        public static bool GetUseShiftWheel(UIElement uiElement) => (bool)uiElement.GetValue(UseShiftWheelProperty);

        #endregion

        //////////////////////////////////////////////////////////////////////////////// Private
        ////////////////////////////////////////////////////////////////////// Event

        #region UI 엘리먼트 마우스 휠 PREVIEW 처리하기 - uiElement_PreviewMouseWheel(sender, e)

        /// <summary>
        /// UI 엘리먼트 마우스 휠 PREVIEW 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private static void uiElement_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
        {
            ScrollViewer scrollViewer = ((UIElement)sender).FindDescendant<ScrollViewer>();

            if(scrollViewer == null)
            {
                return;
            }

            if(Keyboard.Modifiers != ModifierKeys.Shift)
            {
                return;
            }

            if(e.Delta < 0)
            {
                scrollViewer.LineRight();
            }
            else
            {
                scrollViewer.LineLeft();
            }

            e.Handled = true;
        }

        #endregion

        ////////////////////////////////////////////////////////////////////// Function

        #region 시프트/휠 사용 여부 속성 변경시 콜백 처리하기 - UseShiftWheelPropertyChangedCallback(dependencyObject, e)

        /// <summary>
        /// 시프트/휠 사용 여부 속성 변경시 콜백 처리하기
        /// </summary>
        /// <param name="dependencyObject">의존 객체</param>
        /// <param name="e">이벤트 인자</param>
        private static void UseShiftWheelPropertyChangedCallback(DependencyObject dependencyObject, DependencyPropertyChangedEventArgs e)
        {
            UIElement uiElement = dependencyObject as UIElement;

            if(uiElement == null)
            {
                throw new Exception("Attached property must be used with UIElement.");
            }

            if((bool)e.NewValue)
            {
                uiElement.PreviewMouseWheel += uiElement_PreviewMouseWheel;
            }
            else
            {
                uiElement.PreviewMouseWheel -= uiElement_PreviewMouseWheel;
            }
        }

        #endregion
        #region 자손 찾기 - FindDescendant<T>(dependencyObject)

        /// <summary>
        /// 자손 찾기
        /// </summary>
        /// <typeparam name="T">자손 타입</typeparam>
        /// <param name="dependencyObject">의존 객체</param>
        /// <returns>자손</returns>
        private static T FindDescendant<T>(this DependencyObject dependencyObject) where T : DependencyObject
        {
            if(dependencyObject == null)
            {
                return null;
            }

            int count = VisualTreeHelper.GetChildrenCount(dependencyObject);

            for(var i = 0; i < count; i++)
            {
                DependencyObject child = VisualTreeHelper.GetChild(dependencyObject, i);

                T result = child as T ?? FindDescendant<T>(child);

                if(result != null)
                {
                    return result;
                }
            }

            return null;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

using System;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Input;

using System.Windows.Media;

namespace TestProject

{

/// <summary>

/// 스크롤 뷰어 헬퍼

/// </summary>

public static class ScrollViewerHelper

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 시프트/휠 사용 여부 속성

/// </summary>

public static readonly DependencyProperty UseShiftWheelProperty = DependencyProperty.RegisterAttached

(

"UseShiftWheel",

typeof(bool),

typeof(ScrollViewerHelper),

new PropertyMetadata(false, UseShiftWheelPropertyChangedCallback)

);

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region 시프트/휠 사용 여부 설정하기 - SetUseShiftWheel(uiElement, value)

/// <summary>

/// 시프트/휠 사용 여부 설정하기

/// </summary>

/// <param name="uiElement">UI 엘리먼트</param>

/// <param name="value">값</param>

public static void SetUseShiftWheel(UIElement uiElement, bool value) => uiElement.SetValue(UseShiftWheelProperty, value);

#endregion

#region 시프트/휠 사용 여부 구하기 - GetUseShiftWheel(uiElement)

/// <summary>

/// 시프트/휠 사용 여부 구하기

/// </summary>

/// <param name="uiElement">UI 엘리먼트</param>

/// <returns>시프트/휠 사용 여부</returns>

public static bool GetUseShiftWheel(UIElement uiElement) => (bool)uiElement.GetValue(UseShiftWheelProperty);

#endregion

//////////////////////////////////////////////////////////////////////////////// Private

////////////////////////////////////////////////////////////////////// Event

#region UI 엘리먼트 마우스 휠 PREVIEW 처리하기 - uiElement_PreviewMouseWheel(sender, e)

/// <summary>

/// UI 엘리먼트 마우스 휠 PREVIEW 처리하기

/// </summary>

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

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

private static void uiElement_PreviewMouseWheel(object sender, MouseWheelEventArgs e)

{

ScrollViewer scrollViewer = ((UIElement)sender).FindDescendant<ScrollViewer>();

if(scrollViewer == null)

{

return;

}

if(Keyboard.Modifiers != ModifierKeys.Shift)

{

return;

}

if(e.Delta < 0)

{

scrollViewer.LineRight();

}

else

{

scrollViewer.LineLeft();

}

e.Handled = true;

}

#endregion

////////////////////////////////////////////////////////////////////// Function

#region 시프트/휠 사용 여부 속성 변경시 콜백 처리하기 - UseShiftWheelPropertyChangedCallback(dependencyObject, e)

/// <summary>

/// 시프트/휠 사용 여부 속성 변경시 콜백 처리하기

/// </summary>

/// <param name="dependencyObject">의존 객체</param>

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

private static void UseShiftWheelPropertyChangedCallback(DependencyObject dependencyObject, DependencyPropertyChangedEventArgs e)

{

UIElement uiElement = dependencyObject as UIElement;

if(uiElement == null)

{

throw new Exception("Attached property must be used with UIElement.");

}

if((bool)e.NewValue)

{

uiElement.PreviewMouseWheel += uiElement_PreviewMouseWheel;

}

else

{

uiElement.PreviewMouseWheel -= uiElement_PreviewMouseWheel;

}

#endregion

#region 자손 찾기 - FindDescendant<T>(dependencyObject)

/// <summary>

/// 자손 찾기

/// </summary>

/// <typeparam name="T">자손 타입</typeparam>

/// <param name="dependencyObject">의존 객체</param>

/// <returns>자손</returns>

private static T FindDescendant<T>(this DependencyObject dependencyObject) where T : DependencyObject

{

if(dependencyObject == null)

{

return null;

}

int count = VisualTreeHelper.GetChildrenCount(dependencyObject);

for(var i = 0; i < count; i++)

{

DependencyObject child = VisualTreeHelper.GetChild(dependencyObject, i);

T result = child as T ?? FindDescendant<T>(child);

if(result != null)

{

return result;

}

return null;

}

#endregion

}

▶ MainWindow.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:src="clr-namespace:TestProject"
    Width="800"
    Height="600"
    Title="ScrollViewer 클래스 : 시프트 키와 마우스 휠을 사용해 가로 스크롤 처리하기"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Grid src:ScrollViewerHelper.UseShiftWheel="True">
        <ScrollViewer
            HorizontalScrollBarVisibility="Auto"
            VerticalScrollBarVisibility="Auto">
            <StackPanel Orientation="Horizontal">
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
                <Rectangle Width="50" Height="50" Margin="10" Fill="Blue" />
            </StackPanel>
        </ScrollViewer>
    </Grid>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:src="clr-namespace:TestProject"

Width="800"

Height="600"

Title="ScrollViewer 클래스 : 시프트 키와 마우스 휠을 사용해 가로 스크롤 처리하기"

FontFamily="나눔고딕코딩"

FontSize="16">

<ScrollViewer

HorizontalScrollBarVisibility="Auto"

VerticalScrollBarVisibility="Auto">

</StackPanel>

</ScrollViewer>

</Grid>

</Window>

TestProject.zip

[C#/WINFORM] 스크롤 가능한 가계도 만들기

■ 스크롤 가능한 가계도를 만드는 방법을 보여준다. ▶ ITreeNode.cs


using System.Drawing;

namespace TestProject
{
    /// <summary>
    /// 트리 노드 인터페이스
    /// </summary>
    public interface ITreeNode
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Method

        #region 크기 구하기 - GetSize(graphics, font)

        /// <summary>
        /// 크기 구하기
        /// </summary>
        /// <param name="graphics">그래픽스</param>
        /// <param name="font">폰트</param>
        /// <returns>크기</returns>
        SizeF GetSize(Graphics graphics, Font font);

        #endregion
        #region 포인트 위치 여부 구하기 - IsAtPoint(graphics, font, centerPoint, targetPoint)

        /// <summary>
        /// 포인트 위치 여부 구하기
        /// </summary>
        /// <param name="graphics">그래픽스</param>
        /// <param name="font">폰트</param>
        /// <param name="centerPoint">중심 포인트</param>
        /// <param name="targetPoint">타겟 포인트</param>
        /// <returns>포인트 위치 여부</returns>
        bool IsAtPoint(Graphics graphics, Font font, PointF centerPoint, PointF targetPoint);

        #endregion
        #region 그리기 - Draw(x, y, graphics, pen, backgroundBrush, textBrush, font)

        /// <summary>
        /// 그리기
        /// </summary>
        /// <param name="x">X 좌표</param>
        /// <param name="y">Y 좌표</param>
        /// <param name="graphics">그래픽스</param>
        /// <param name="pen">펜</param>
        /// <param name="backgroundBrush">배경 브러시</param>
        /// <param name="textBrush">텍스트 브러시</param>
        /// <param name="font">폰트</param>
        void Draw(float x, float y, Graphics graphics, Pen pen, Brush backgroundBrush, Brush textBrush, Font font);

        #endregion
    }
}

using System.Drawing;

namespace TestProject

{

/// <summary>

/// 트리 노드 인터페이스

/// </summary>

public interface ITreeNode

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

#region 크기 구하기 - GetSize(graphics, font)

/// <summary>

/// 크기 구하기

/// </summary>

/// <param name="graphics">그래픽스</param>

/// <param name="font">폰트</param>

/// <returns>크기</returns>

SizeF GetSize(Graphics graphics, Font font);

#endregion

#region 포인트 위치 여부 구하기 - IsAtPoint(graphics, font, centerPoint, targetPoint)

/// <summary>

/// 포인트 위치 여부 구하기

/// </summary>

/// <param name="graphics">그래픽스</param>

/// <param name="font">폰트</param>

/// <param name="centerPoint">중심 포인트</param>

/// <param name="targetPoint">타겟 포인트</param>

/// <returns>포인트 위치 여부</returns>

bool IsAtPoint(Graphics graphics, Font font, PointF centerPoint, PointF targetPoint);

#endregion

#region 그리기 - Draw(x, y, graphics, pen, backgroundBrush, textBrush, font)

/// <summary>

/// 그리기

/// </summary>

/// <param name="x">X 좌표</param>

/// <param name="y">Y 좌표</param>

/// <param name="graphics">그래픽스</param>

/// <param name="pen">펜</param>

/// <param name="backgroundBrush">배경 브러시</param>

/// <param name="textBrush">텍스트 브러시</param>

/// <param name="font">폰트</param>

void Draw(float x, float y, Graphics graphics, Pen pen, Brush backgroundBrush, Brush textBrush, Font font);

#endregion

}

▶ TreeNode.cs


using System.Collections.Generic;
using System.Drawing;

namespace TestProject
{
    /// <summary>
    /// 트리 노드
    /// </summary>
    /// <typeparam name="TData">데이터 타입</typeparam>
    public class TreeNode<TData> where TData : ITreeNode
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region Field

        /// <summary>
        /// 데이터
        /// </summary>
        public TData Data;

        /// <summary>
        /// 자식 노드 리스트
        /// </summary>
        public List<TreeNode<TData>> ChildNodeList = new List<TreeNode<TData>>();

        /// <summary>
        /// 폰트
        /// </summary>
        public Font Font = null;

        /// <summary>
        /// 펜
        /// </summary>
        public Pen Pen = Pens.Black;

        /// <summary>
        /// 폰트 브러시
        /// </summary>
        public Brush FontBrush = Brushes.Black;

        /// <summary>
        /// 배경 브러시
        /// </summary>
        public Brush BackgroundBrush = Brushes.White;

        /// <summary>
        /// 중심 포인트
        /// </summary>
        public PointF CenterPoint;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 수평 오프셋
        /// </summary>
        private const float HORIZONTAL_OFFSET = 30;

        /// <summary>
        /// 수직 오프셋
        /// </summary>
        private const float VERTICAL_OFFSET = 20;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - TreeNode(data, font)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="data">데이터</param>
        /// <param name="font">폰트</param>
        public TreeNode(TData data, Font font)
        {
            Data = data;
            Font = font;
        }

        #endregion
        #region 생성자 - TreeNode(data)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="data">데이터</param>
        public TreeNode(TData data) : this(data, new Font("나눔고딕코딩", 12))
        {
            Data = data;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 자식 추가하기 - AddChild(childNode)

        /// <summary>
        /// 자식 추가하기
        /// </summary>
        /// <param name="childNode">자식 노드</param>
        public void AddChild(TreeNode<TData> childNode)
        {
            ChildNodeList.Add(childNode);
        }

        #endregion
        #region 배열하기 - Arrange(graphics, minimumX, minimumY)

        /// <summary>
        /// 배열하기
        /// </summary>
        /// <param name="graphics">그래픽스</param>
        /// <param name="minimumX">X 최소값</param>
        /// <param name="minimumY">Y 최소값</param>
        public void Arrange(Graphics graphics, ref float minimumX, ref float minimumY)
        {
            SizeF dataSize = Data.GetSize(graphics, Font);

            float x                 = minimumX;
            float biggestMinimumY   = minimumY + dataSize.Height;
            float childTreeMinimumY = minimumY + dataSize.Height + VERTICAL_OFFSET;

            foreach(TreeNode<TData> childNode in ChildNodeList)
            {
                float childMinimumY = childTreeMinimumY;

                childNode.Arrange(graphics, ref x, ref childMinimumY);

                if(biggestMinimumY < childMinimumY)
                {
                    biggestMinimumY = childMinimumY;
                }

                x += HORIZONTAL_OFFSET;
            }

            if(ChildNodeList.Count > 0)
            {
                x -= HORIZONTAL_OFFSET;
            }

            float childTreeWidth = x - minimumX;

            if(dataSize.Width > childTreeWidth)
            {
                x = minimumX + (dataSize.Width - childTreeWidth) / 2;

                foreach(TreeNode<TData> childNode in ChildNodeList)
                {
                    childNode.Arrange(graphics, ref x, ref childTreeMinimumY);

                    x += HORIZONTAL_OFFSET;
                }

                childTreeWidth = dataSize.Width;
            }

            CenterPoint = new PointF
            (
                minimumX + childTreeWidth  / 2,
                minimumY + dataSize.Height / 2
            );

            minimumX += childTreeWidth;

            minimumY = biggestMinimumY;
        }

        #endregion
        #region 트리 그리기 - DrawTree(graphics)

        /// <summary>
        /// 트리 그리기
        /// </summary>
        /// <param name="graphics">그래픽스</param>
        public void DrawTree(Graphics graphics)
        {
            DrawChildNodeLink(graphics);

            DrawChildNode(graphics);
        }

        #endregion
        #region 트리 그리기 - DrawTree(graphics, x, y)

        /// <summary>
        /// 트리 그리기
        /// </summary>
        /// <param name="graphics">그래픽스</param>
        /// <param name="x">X 좌표</param>
        /// <param name="y">Y 좌표</param>
        public void DrawTree(Graphics graphics, ref float x, float y)
        {
            Arrange(graphics, ref x, ref y);

            DrawTree(graphics);
        }

        #endregion
        #region 노드 구하기 - GetNode(graphics, targetPoint)

        /// <summary>
        /// 노드 구하기
        /// </summary>
        /// <param name="graphics">그래픽스</param>
        /// <param name="targetPoint">타겟 포인트</param>
        /// <returns>노드</returns>
        public TreeNode<TData> GetNode(Graphics graphics, PointF targetPoint)
        {
            if(Data.IsAtPoint(graphics, Font, CenterPoint, targetPoint))
            {
                return this;
            }

            foreach(TreeNode<TData> childNode in ChildNodeList)
            {
                TreeNode<TData> hitNode = childNode.GetNode(graphics, targetPoint);

                if(hitNode != null)
                {
                    return hitNode;
                }
            }

            return null;
        }

        #endregion
        #region 노드 삭제하기 - DeleteNode(targetNode)

        /// <summary>
        /// 노드 삭제하기
        /// </summary>
        /// <param name="targetNode">타겟 노드</param>
        /// <returns>삭제 결과</returns>
        public bool DeleteNode(TreeNode<TData> targetNode)
        {
            foreach(TreeNode<TData> childNode in ChildNodeList)
            {
                if(childNode == targetNode)
                {
                    ChildNodeList.Remove(childNode);

                    return true;
                }

                if(childNode.DeleteNode(targetNode))
                {
                    return true;
                }
            }

            return false;
        }

        #endregion

        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region 자식 노드 링크 그리기 - DrawChildNodeLink(graphics)

        /// <summary>
        /// 자식 노드 링크 그리기
        /// </summary>
        /// <param name="graphics">그래픽스</param>
        private void DrawChildNodeLink(Graphics graphics)
        {
            if(ChildNodeList.Count == 1)
            {
                graphics.DrawLine(Pen, CenterPoint, ChildNodeList[0].CenterPoint);
            }
            else if(ChildNodeList.Count > 1)
            {
                float minimumX = ChildNodeList[0].CenterPoint.X;
                float maximumX = ChildNodeList[ChildNodeList.Count - 1].CenterPoint.X;
                SizeF dataSize = Data.GetSize(graphics, Font);
                float y        = CenterPoint.Y + dataSize.Height / 2 + VERTICAL_OFFSET / 2f;

                graphics.DrawLine(Pen, minimumX, y, maximumX, y);

                graphics.DrawLine(Pen, CenterPoint.X, CenterPoint.Y, CenterPoint.X, y);

                foreach(TreeNode<TData> childNode in ChildNodeList)
                {
                    graphics.DrawLine
                    (
                        Pen,
                        childNode.CenterPoint.X, y,
                        childNode.CenterPoint.X, childNode.CenterPoint.Y
                    );
                }
            }

            foreach(TreeNode<TData> childNode in ChildNodeList)
            {
                childNode.DrawChildNodeLink(graphics);
            }
        }

        #endregion
        #region 자식 노드 그리기 - DrawChildNode(graphics)

        /// <summary>
        /// 자식 노드 그리기
        /// </summary>
        /// <param name="graphics">그래픽스</param>
        private void DrawChildNode(Graphics graphics)
        {
            Data.Draw(CenterPoint.X, CenterPoint.Y, graphics, Pen, BackgroundBrush, FontBrush, Font);

            foreach(TreeNode<TData> childNode in ChildNodeList)
            {
                childNode.DrawChildNode(graphics);
            }
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

285

286

287

288

289

290

291

292

293

294

295

296

297

298

299

300

301

302

303

304

305

306

307

308

309

310

311

312

313

314

315

316

317

318

319

320

321

322

323

324

325

326

327

328

329

330

using System.Collections.Generic;

using System.Drawing;

namespace TestProject

{

/// <summary>

/// 트리 노드

/// </summary>

/// <typeparam name="TData">데이터 타입</typeparam>

public class TreeNode<TData> where TData : ITreeNode

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Public

#region Field

/// <summary>

/// 데이터

/// </summary>

public TData Data;

/// <summary>

/// 자식 노드 리스트

/// </summary>

public List<TreeNode<TData>> ChildNodeList = new List<TreeNode<TData>>();

/// <summary>

/// 폰트

/// </summary>

public Font Font = null;

/// <summary>

/// 펜

/// </summary>

public Pen Pen = Pens.Black;

/// <summary>

/// 폰트 브러시

/// </summary>

public Brush FontBrush = Brushes.Black;

/// <summary>

/// 배경 브러시

/// </summary>

public Brush BackgroundBrush = Brushes.White;

/// <summary>

/// 중심 포인트

/// </summary>

public PointF CenterPoint;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 수평 오프셋

/// </summary>

private const float HORIZONTAL_OFFSET = 30;

/// <summary>

/// 수직 오프셋

/// </summary>

private const float VERTICAL_OFFSET = 20;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - TreeNode(data, font)

/// <summary>

/// 생성자

/// </summary>

/// <param name="data">데이터</param>

/// <param name="font">폰트</param>

public TreeNode(TData data, Font font)

{

Data = data;

Font = font;

}

#endregion

#region 생성자 - TreeNode(data)

/// <summary>

/// 생성자

/// </summary>

/// <param name="data">데이터</param>

public TreeNode(TData data) : this(data, new Font("나눔고딕코딩", 12))

{

Data = data;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 자식 추가하기 - AddChild(childNode)

/// <summary>

/// 자식 추가하기

/// </summary>

/// <param name="childNode">자식 노드</param>

public void AddChild(TreeNode<TData> childNode)

{

ChildNodeList.Add(childNode);

}

#endregion

#region 배열하기 - Arrange(graphics, minimumX, minimumY)

/// <summary>

/// 배열하기

/// </summary>

/// <param name="graphics">그래픽스</param>

/// <param name="minimumX">X 최소값</param>

/// <param name="minimumY">Y 최소값</param>

public void Arrange(Graphics graphics, ref float minimumX, ref float minimumY)

{

SizeF dataSize = Data.GetSize(graphics, Font);

float x = minimumX;

float biggestMinimumY = minimumY + dataSize.Height;

float childTreeMinimumY = minimumY + dataSize.Height + VERTICAL_OFFSET;

foreach(TreeNode<TData> childNode in ChildNodeList)

{

float childMinimumY = childTreeMinimumY;

childNode.Arrange(graphics, ref x, ref childMinimumY);

if(biggestMinimumY < childMinimumY)

{

biggestMinimumY = childMinimumY;

}

x += HORIZONTAL_OFFSET;

}

if(ChildNodeList.Count > 0)

{

x -= HORIZONTAL_OFFSET;

}

float childTreeWidth = x - minimumX;

if(dataSize.Width > childTreeWidth)

{

x = minimumX + (dataSize.Width - childTreeWidth) / 2;

foreach(TreeNode<TData> childNode in ChildNodeList)

{

childNode.Arrange(graphics, ref x, ref childTreeMinimumY);

x += HORIZONTAL_OFFSET;

}

childTreeWidth = dataSize.Width;

}

CenterPoint = new PointF

(

minimumX + childTreeWidth / 2,

minimumY + dataSize.Height / 2

);

minimumX += childTreeWidth;

minimumY = biggestMinimumY;

}

#endregion

#region 트리 그리기 - DrawTree(graphics)

/// <summary>

/// 트리 그리기

/// </summary>

/// <param name="graphics">그래픽스</param>

public void DrawTree(Graphics graphics)

{

DrawChildNodeLink(graphics);

DrawChildNode(graphics);

}

#endregion

#region 트리 그리기 - DrawTree(graphics, x, y)

/// <summary>

/// 트리 그리기

/// </summary>

/// <param name="graphics">그래픽스</param>

/// <param name="x">X 좌표</param>

/// <param name="y">Y 좌표</param>

public void DrawTree(Graphics graphics, ref float x, float y)

{

Arrange(graphics, ref x, ref y);

DrawTree(graphics);

}

#endregion

#region 노드 구하기 - GetNode(graphics, targetPoint)

/// <summary>

/// 노드 구하기

/// </summary>

/// <param name="graphics">그래픽스</param>

/// <param name="targetPoint">타겟 포인트</param>

/// <returns>노드</returns>

public TreeNode<TData> GetNode(Graphics graphics, PointF targetPoint)

{

if(Data.IsAtPoint(graphics, Font, CenterPoint, targetPoint))

{

return this;

}

foreach(TreeNode<TData> childNode in ChildNodeList)

{

TreeNode<TData> hitNode = childNode.GetNode(graphics, targetPoint);

if(hitNode != null)

{

return hitNode;

}

return null;

}

#endregion

#region 노드 삭제하기 - DeleteNode(targetNode)

/// <summary>

/// 노드 삭제하기

/// </summary>

/// <param name="targetNode">타겟 노드</param>

/// <returns>삭제 결과</returns>

public bool DeleteNode(TreeNode<TData> targetNode)

{

foreach(TreeNode<TData> childNode in ChildNodeList)

{

if(childNode == targetNode)

{

ChildNodeList.Remove(childNode);

return true;

}

if(childNode.DeleteNode(targetNode))

{

return true;

}

return false;

}

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 자식 노드 링크 그리기 - DrawChildNodeLink(graphics)

/// <summary>

/// 자식 노드 링크 그리기

/// </summary>

/// <param name="graphics">그래픽스</param>

private void DrawChildNodeLink(Graphics graphics)

{

if(ChildNodeList.Count == 1)

{

graphics.DrawLine(Pen, CenterPoint, ChildNodeList[0].CenterPoint);

}

else if(ChildNodeList.Count > 1)

{

float minimumX = ChildNodeList[0].CenterPoint.X;

float maximumX = ChildNodeList[ChildNodeList.Count - 1].CenterPoint.X;

SizeF dataSize = Data.GetSize(graphics, Font);

float y = CenterPoint.Y + dataSize.Height / 2 + VERTICAL_OFFSET / 2f;

graphics.DrawLine(Pen, minimumX, y, maximumX, y);

graphics.DrawLine(Pen, CenterPoint.X, CenterPoint.Y, CenterPoint.X, y);

foreach(TreeNode<TData> childNode in ChildNodeList)

{

graphics.DrawLine

(

Pen,

childNode.CenterPoint.X, y,

childNode.CenterPoint.X, childNode.CenterPoint.Y

);

}

foreach(TreeNode<TData> childNode in ChildNodeList)

{

childNode.DrawChildNodeLink(graphics);

}

#endregion

#region 자식 노드 그리기 - DrawChildNode(graphics)

/// <summary>

/// 자식 노드 그리기

/// </summary>

/// <param name="graphics">그래픽스</param>

private void DrawChildNode(Graphics graphics)

{

Data.Draw(CenterPoint.X, CenterPoint.Y, graphics, Pen, BackgroundBrush, FontBrush, Font);

foreach(TreeNode<TData> childNode in ChildNodeList)

{

childNode.DrawChildNode(graphics);

}

#endregion

}

▶ ImageNode.cs


using System.Drawing;
using System.Windows.Forms;

namespace TestProject
{
    /// <summary>
    /// 이미지 노드
    /// </summary>
    public class ImageNode : ITreeNode
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region Field

        /// <summary>
        /// 노드 크기
        /// </summary>
        public SizeF NodeSize = new SizeF(100, 100);

        /// <summary>
        /// 설명
        /// </summary>
        public string Description;

        /// <summary>
        /// 이미지
        /// </summary>
        public Image Image = null;

        /// <summary>
        /// 선택 여부
        /// </summary>
        public bool Selected = false;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - ImageNode(description, image)

        /// <summary>
        /// 생성자
        /// </summary>
        /// <param name="description">설명</param>
        /// <param name="image">이미지</param>
        public ImageNode(string description, Image image)
        {
            Description = description;
            Image       = image;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 크기 구하기 - GetSize(graphics, font)

        /// <summary>
        /// 크기 구하기
        /// </summary>
        /// <param name="graphics">그래픽스</param>
        /// <param name="font">폰트</param>
        /// <returns>크기</returns>
        public SizeF GetSize(Graphics graphics, Font font)
        {
            return NodeSize;
        }

        #endregion
        #region 포인트 위치 여부 구하기 - IsAtPoint(graphics, font, centerPoint, targetPoint)

        /// <summary>
        /// 포인트 위치 여부 구하기
        /// </summary>
        /// <param name="graphics">그래픽스</param>
        /// <param name="font">폰트</param>
        /// <param name="centerPoint">중심 포인트</param>
        /// <param name="targetPoint">타겟 포인트</param>
        /// <returns>포인트 위치 여부</returns>
        public bool IsAtPoint(Graphics graphics, Font font, PointF centerPoint, PointF targetPoint)
        {
            RectangleF rectangle = GetNodeRectangle(centerPoint);

            return rectangle.Contains(targetPoint);
        }

        #endregion
        #region 그리기 - Draw(x, y, graphics, pen, backgroundBrush, textBrush, font)

        /// <summary>
        /// 그리기
        /// </summary>
        /// <param name="x">X 좌표</param>
        /// <param name="y">Y 좌표</param>
        /// <param name="graphics">그래픽스</param>
        /// <param name="pen">펜</param>
        /// <param name="backgroundBrush">배경 브러시</param>
        /// <param name="textBrush">텍스트 브러시</param>
        /// <param name="font">폰트</param>
        public void Draw(float x, float y, Graphics graphics, Pen pen, Brush backgroundBrush, Brush textBrush, Font font)
        {
            RectangleF nodeRectangle       = GetNodeRectangle(new PointF(x, y));
            Rectangle  actualNodeRectangle = Rectangle.Round(nodeRectangle);

            if(Selected)
            {
                graphics.FillRectangle(Brushes.White, actualNodeRectangle);

                ControlPaint.DrawBorder3D
                (
                    graphics,
                    actualNodeRectangle,
                    Border3DStyle.Sunken
                );
            }
            else
            {
                graphics.FillRectangle(Brushes.LightGray, actualNodeRectangle);

                ControlPaint.DrawBorder3D
                (
                    graphics,
                    actualNodeRectangle,
                    Border3DStyle.Raised
                );
            }

            nodeRectangle.Inflate(-5, -5);

            nodeRectangle = GetImageRectangle(Image, nodeRectangle);

            graphics.DrawImage(Image, nodeRectangle);
        }

        #endregion

        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region 노드 사각형 구하기 - GetNodeRectangle(centerPoint)

        /// <summary>
        /// 노드 사각형 구하기
        /// </summary>
        /// <param name="centerPoint">중심 포인트</param>
        /// <returns>노드 사각형</returns>
        private RectangleF GetNodeRectangle(PointF centerPoint)
        {
            return new RectangleF
            (
                centerPoint.X - NodeSize.Width  / 2,
                centerPoint.Y - NodeSize.Height / 2,
                NodeSize.Width,
                NodeSize.Height
            );
        }

        #endregion
        #region 이미지 사각형 구하기 - GetImageRectangle(image, layoutRectangle)

        /// <summary>
        /// 이미지 사각형 구하기
        /// </summary>
        /// <param name="image">이미지</param>
        /// <param name="layoutRectangle">레이아웃 사각형</param>
        /// <returns>이미지 사각형</returns>
        private RectangleF GetImageRectangle(Image image, RectangleF layoutRectangle)
        {
            float imageWidth           = image.Width;
            float imageHeight          = image.Height;
            float imageAspectRatio     = imageWidth / imageHeight;
            float rectangleAspectRatio = layoutRectangle.Width / layoutRectangle.Height;
            float scale = 1;

            if(imageAspectRatio > rectangleAspectRatio)
            {
                scale = layoutRectangle.Width / imageWidth;
            }
            else
            {
                scale = layoutRectangle.Height / imageHeight;
            }

            imageWidth  *= scale;
            imageHeight *= scale;

            RectangleF imageRectangle = new RectangleF
            (
                layoutRectangle.X + (layoutRectangle.Width  - imageWidth ) / 2,
                layoutRectangle.Y + (layoutRectangle.Height - imageHeight) / 2,
                imageWidth,
                imageHeight
            );

            return imageRectangle;
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

using System.Drawing;

using System.Windows.Forms;

namespace TestProject

{

/// <summary>

/// 이미지 노드

/// </summary>

public class ImageNode : ITreeNode

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Public

#region Field

/// <summary>

/// 노드 크기

/// </summary>

public SizeF NodeSize = new SizeF(100, 100);

/// <summary>

/// 설명

/// </summary>

public string Description;

/// <summary>

/// 이미지

/// </summary>

public Image Image = null;

/// <summary>

/// 선택 여부

/// </summary>

public bool Selected = false;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - ImageNode(description, image)

/// <summary>

/// 생성자

/// </summary>

/// <param name="description">설명</param>

/// <param name="image">이미지</param>

public ImageNode(string description, Image image)

{

Description = description;

Image = image;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 크기 구하기 - GetSize(graphics, font)

/// <summary>

/// 크기 구하기

/// </summary>

/// <param name="graphics">그래픽스</param>

/// <param name="font">폰트</param>

/// <returns>크기</returns>

public SizeF GetSize(Graphics graphics, Font font)

{

return NodeSize;

}

#endregion

#region 포인트 위치 여부 구하기 - IsAtPoint(graphics, font, centerPoint, targetPoint)

/// <summary>

/// 포인트 위치 여부 구하기

/// </summary>

/// <param name="graphics">그래픽스</param>

/// <param name="font">폰트</param>

/// <param name="centerPoint">중심 포인트</param>

/// <param name="targetPoint">타겟 포인트</param>

/// <returns>포인트 위치 여부</returns>

public bool IsAtPoint(Graphics graphics, Font font, PointF centerPoint, PointF targetPoint)

{

RectangleF rectangle = GetNodeRectangle(centerPoint);

return rectangle.Contains(targetPoint);

}

#endregion

#region 그리기 - Draw(x, y, graphics, pen, backgroundBrush, textBrush, font)

/// <summary>

/// 그리기

/// </summary>

/// <param name="x">X 좌표</param>

/// <param name="y">Y 좌표</param>

/// <param name="graphics">그래픽스</param>

/// <param name="pen">펜</param>

/// <param name="backgroundBrush">배경 브러시</param>

/// <param name="textBrush">텍스트 브러시</param>

/// <param name="font">폰트</param>

public void Draw(float x, float y, Graphics graphics, Pen pen, Brush backgroundBrush, Brush textBrush, Font font)

{

RectangleF nodeRectangle = GetNodeRectangle(new PointF(x, y));

Rectangle actualNodeRectangle = Rectangle.Round(nodeRectangle);

if(Selected)

{

graphics.FillRectangle(Brushes.White, actualNodeRectangle);

ControlPaint.DrawBorder3D

(

graphics,

actualNodeRectangle,

Border3DStyle.Sunken

);

}

else

{

graphics.FillRectangle(Brushes.LightGray, actualNodeRectangle);

ControlPaint.DrawBorder3D

(

graphics,

actualNodeRectangle,

Border3DStyle.Raised

);

}

nodeRectangle.Inflate(-5, -5);

nodeRectangle = GetImageRectangle(Image, nodeRectangle);

graphics.DrawImage(Image, nodeRectangle);

}

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 노드 사각형 구하기 - GetNodeRectangle(centerPoint)

/// <summary>

/// 노드 사각형 구하기

/// </summary>

/// <param name="centerPoint">중심 포인트</param>

/// <returns>노드 사각형</returns>

private RectangleF GetNodeRectangle(PointF centerPoint)

{

return new RectangleF

(

centerPoint.X - NodeSize.Width / 2,

centerPoint.Y - NodeSize.Height / 2,

NodeSize.Width,

NodeSize.Height

);

}

#endregion

#region 이미지 사각형 구하기 - GetImageRectangle(image, layoutRectangle)

/// <summary>

/// 이미지 사각형 구하기

/// </summary>

/// <param name="image">이미지</param>

/// <param name="layoutRectangle">레이아웃 사각형</param>

/// <returns>이미지 사각형</returns>

private RectangleF GetImageRectangle(Image image, RectangleF layoutRectangle)

{

float imageWidth = image.Width;

float imageHeight = image.Height;

float imageAspectRatio = imageWidth / imageHeight;

float rectangleAspectRatio = layoutRectangle.Width / layoutRectangle.Height;

float scale = 1;

if(imageAspectRatio > rectangleAspectRatio)

{

scale = layoutRectangle.Width / imageWidth;

}

else

{

scale = layoutRectangle.Height / imageHeight;

}

imageWidth *= scale;

imageHeight *= scale;

RectangleF imageRectangle = new RectangleF

(

layoutRectangle.X + (layoutRectangle.Width - imageWidth ) / 2,

layoutRectangle.Y + (layoutRectangle.Height - imageHeight) / 2,

imageWidth,

imageHeight

);

return imageRectangle;

}

#endregion

}

▶ MainForm.cs


using System;
using System.Drawing;
using System.Drawing.Drawing2D;
using System.Drawing.Text;
using System.Windows.Forms;

namespace TestProject
{
    /// <summary>
    /// 메인 폼
    /// </summary>
    public partial class MainForm : Form
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 루트 노드
        /// </summary>
        private TreeNode<ImageNode> rootNode = new TreeNode<ImageNode>
        (
            new ImageNode
            (
                "Queen Elizabeth II && Prince Philip Duke of Edinburgh",
                Properties.Resources.Elizabeth_Philip
            )
        );

        /// <summary>
        /// 선택 노드
        /// </summary>
        private TreeNode<ImageNode> selectedNode;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainForm()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainForm()
        {
            InitializeComponent();

            #region 이벤트를 설정한다.

            Load                             += Form_Load;
            this.canvasPictureBox.MouseClick += canvasPictureBox_MouseClick;

            #endregion
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private
        //////////////////////////////////////////////////////////////////////////////// Event

        #region 폼 로드시 처리하기 - Form_Load(sender, e)

        /// <summary>
        /// 폼 로드시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void Form_Load(object sender, EventArgs e)
        {
            TreeNode<ImageNode> charlesNode = new TreeNode<ImageNode>
            (
                new ImageNode
                (
                    "Prince Charles, Prince of Wales",
                    Properties.Resources.Charles
                )
            );

            TreeNode<ImageNode> anneNode = new TreeNode<ImageNode>
            (
                new ImageNode
                (
                    "Princess Anne",
                    Properties.Resources.Anne
                )
            );

            TreeNode<ImageNode> andrewNode = new TreeNode<ImageNode>
            (
                new ImageNode
                (
                    "Prince Andrew, Duke of York",
                    Properties.Resources.Andrew
                )
            );

            TreeNode<ImageNode> edwardNode = new TreeNode<ImageNode>
            (
                new ImageNode
                (
                    "Prince Edward, Earl of Wessex",
                    Properties.Resources.Edward
                )
            );

            TreeNode<ImageNode> williamNode = new TreeNode<ImageNode>
            (
                new ImageNode
                (
                    "Prince William",
                    Properties.Resources.William
                )
            );

            TreeNode<ImageNode> harryNode = new TreeNode<ImageNode>
            (
                new ImageNode
                (
                    "Prince Henry (Harry)",
                    Properties.Resources.Harry
                )
            );

            TreeNode<ImageNode> peterNode = new TreeNode<ImageNode>
            (
                new ImageNode
                (
                    "Peter Phillips",
                    Properties.Resources.Peter
                )
            );

            TreeNode<ImageNode> zaraNode = new TreeNode<ImageNode>
            (
                new ImageNode
                (
                    "Zara Phillips",
                    Properties.Resources.Zara
                )
            );

            TreeNode<ImageNode> beatriceNode = new TreeNode<ImageNode>
            (
                new ImageNode
                (
                    "Princess Beatrice",
                    Properties.Resources.Beatrice
                )
            );

            TreeNode<ImageNode> eugenieNode = new TreeNode<ImageNode>
            (
                new ImageNode
                (
                    "Princess Eugenie",
                    Properties.Resources.Eugenie
                )
            );

            TreeNode<ImageNode> louiseNode = new TreeNode<ImageNode>
            (
                new ImageNode
                (
                    "Lady Louise",
                    Properties.Resources.Louise
                )
            );

            TreeNode<ImageNode> severnNode = new TreeNode<ImageNode>
            (
                new ImageNode
                (
                    "Viscount Severn",
                    Properties.Resources.Severn
                )
            );

            this.rootNode.AddChild(charlesNode);

            charlesNode.AddChild(williamNode);
            charlesNode.AddChild(harryNode);

            this.rootNode.AddChild(anneNode);

            anneNode.AddChild(peterNode);
            anneNode.AddChild(zaraNode);

            this.rootNode.AddChild(andrewNode);

            andrewNode.AddChild(beatriceNode);
            andrewNode.AddChild(eugenieNode);

            this.rootNode.AddChild(edwardNode);

            edwardNode.AddChild(louiseNode);
            edwardNode.AddChild(severnNode);


            this.contentPanel.AutoScroll = true;

            this.canvasPictureBox.Location = new Point(0, 0);
            this.canvasPictureBox.SizeMode = PictureBoxSizeMode.AutoSize;
            this.canvasPictureBox.Image    = DrawTree(rootNode, 5);
        }

        #endregion
        #region 캔버스 픽처 박스  마우스 클릭시 처리하기 - canvasPictureBox_MouseClick(sender, e)

        /// <summary>
        /// 캔버스 픽처 박스  마우스 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void canvasPictureBox_MouseClick(object sender, MouseEventArgs e)
        {
            FindNodeUnderMouse(e.Location);
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////// Function

        #region 트리 그리기 - DrawTree(rootNode, margin)

        /// <summary>
        /// 트리 그리기
        /// </summary>
        /// <param name="rootNode">루트 노드</param>
        /// <param name="margin">마진</param>
        /// <returns>비트맵</returns>
        private Bitmap DrawTree(TreeNode<ImageNode> rootNode, int margin)
        {
            float minimumX = margin;
            float minimumY = margin;

            using(Bitmap sourceBitmap = new Bitmap(10, 10))
            {
                using(Graphics sourceGraphics = Graphics.FromImage(sourceBitmap))
                {
                    rootNode.Arrange(sourceGraphics, ref minimumX, ref minimumY);
                }
            }

            int width  = (int)minimumX + margin;
            int height = (int)minimumY + margin;

            Bitmap targetBitmap = new Bitmap(width, height);

            using(Graphics tragetBitmap = Graphics.FromImage(targetBitmap))
            {
                tragetBitmap.SmoothingMode     = SmoothingMode.AntiAlias;
                tragetBitmap.TextRenderingHint = TextRenderingHint.AntiAliasGridFit;

                rootNode.DrawTree(tragetBitmap);
            }

            return targetBitmap;
        }

        #endregion
        #region 마우스 아래 노드 찾기 - FindNodeUnderMouse(point)

        /// <summary>
        /// 마우스 아래 노드 찾기
        /// </summary>
        /// <param name="point">포인트</param>
        private void FindNodeUnderMouse(PointF point)
        {
            if(selectedNode != null)
            {
                this.selectedNode.Data.Selected = false;

                this.statusLabel.Text = string.Empty;
            }

            using(Graphics graphics = this.canvasPictureBox.CreateGraphics())
            {
                this.selectedNode = this.rootNode.GetNode(graphics, point);
            }

            if(this.selectedNode != null)
            {
                this.selectedNode.Data.Selected = true;

                this.statusLabel.Text = this.selectedNode.Data.Description;
            }

            this.canvasPictureBox.Refresh();
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

285

286

287

288

289

290

291

292

293

294

295

296

297

298

using System;

using System.Drawing;

using System.Drawing.Drawing2D;

using System.Drawing.Text;

using System.Windows.Forms;

namespace TestProject

{

/// <summary>

/// 메인 폼

/// </summary>

public partial class MainForm : Form

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 루트 노드

/// </summary>

private TreeNode<ImageNode> rootNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Queen Elizabeth II && Prince Philip Duke of Edinburgh",

Properties.Resources.Elizabeth_Philip

)

);

/// <summary>

/// 선택 노드

/// </summary>

private TreeNode<ImageNode> selectedNode;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainForm()

/// <summary>

/// 생성자

/// </summary>

public MainForm()

{

InitializeComponent();

#region 이벤트를 설정한다.

Load += Form_Load;

this.canvasPictureBox.MouseClick += canvasPictureBox_MouseClick;

#endregion

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Event

#region 폼 로드시 처리하기 - Form_Load(sender, e)

/// <summary>

/// 폼 로드시 처리하기

/// </summary>

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

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

private void Form_Load(object sender, EventArgs e)

{

TreeNode<ImageNode> charlesNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Prince Charles, Prince of Wales",

Properties.Resources.Charles

)

);

TreeNode<ImageNode> anneNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Princess Anne",

Properties.Resources.Anne

)

);

TreeNode<ImageNode> andrewNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Prince Andrew, Duke of York",

Properties.Resources.Andrew

)

);

TreeNode<ImageNode> edwardNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Prince Edward, Earl of Wessex",

Properties.Resources.Edward

)

);

TreeNode<ImageNode> williamNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Prince William",

Properties.Resources.William

)

);

TreeNode<ImageNode> harryNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Prince Henry (Harry)",

Properties.Resources.Harry

)

);

TreeNode<ImageNode> peterNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Peter Phillips",

Properties.Resources.Peter

)

);

TreeNode<ImageNode> zaraNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Zara Phillips",

Properties.Resources.Zara

)

);

TreeNode<ImageNode> beatriceNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Princess Beatrice",

Properties.Resources.Beatrice

)

);

TreeNode<ImageNode> eugenieNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Princess Eugenie",

Properties.Resources.Eugenie

)

);

TreeNode<ImageNode> louiseNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Lady Louise",

Properties.Resources.Louise

)

);

TreeNode<ImageNode> severnNode = new TreeNode<ImageNode>

(

new ImageNode

(

"Viscount Severn",

Properties.Resources.Severn

)

);

this.rootNode.AddChild(charlesNode);

charlesNode.AddChild(williamNode);

charlesNode.AddChild(harryNode);

this.rootNode.AddChild(anneNode);

anneNode.AddChild(peterNode);

anneNode.AddChild(zaraNode);

this.rootNode.AddChild(andrewNode);

andrewNode.AddChild(beatriceNode);

andrewNode.AddChild(eugenieNode);

this.rootNode.AddChild(edwardNode);

edwardNode.AddChild(louiseNode);

edwardNode.AddChild(severnNode);

this.contentPanel.AutoScroll = true;

this.canvasPictureBox.Location = new Point(0, 0);

this.canvasPictureBox.SizeMode = PictureBoxSizeMode.AutoSize;

this.canvasPictureBox.Image = DrawTree(rootNode, 5);

}

#endregion

#region 캔버스 픽처 박스 마우스 클릭시 처리하기 - canvasPictureBox_MouseClick(sender, e)

/// <summary>

/// 캔버스 픽처 박스 마우스 클릭시 처리하기

/// </summary>

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

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

private void canvasPictureBox_MouseClick(object sender, MouseEventArgs e)

{

FindNodeUnderMouse(e.Location);

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Function

#region 트리 그리기 - DrawTree(rootNode, margin)

/// <summary>

/// 트리 그리기

/// </summary>

/// <param name="rootNode">루트 노드</param>

/// <param name="margin">마진</param>

/// <returns>비트맵</returns>

private Bitmap DrawTree(TreeNode<ImageNode> rootNode, int margin)

{

float minimumX = margin;

float minimumY = margin;

using(Bitmap sourceBitmap = new Bitmap(10, 10))

{

using(Graphics sourceGraphics = Graphics.FromImage(sourceBitmap))

{

rootNode.Arrange(sourceGraphics, ref minimumX, ref minimumY);

}

int width = (int)minimumX + margin;

int height = (int)minimumY + margin;

Bitmap targetBitmap = new Bitmap(width, height);

using(Graphics tragetBitmap = Graphics.FromImage(targetBitmap))

{

tragetBitmap.SmoothingMode = SmoothingMode.AntiAlias;

tragetBitmap.TextRenderingHint = TextRenderingHint.AntiAliasGridFit;

rootNode.DrawTree(tragetBitmap);

}

return targetBitmap;

}

#endregion

#region 마우스 아래 노드 찾기 - FindNodeUnderMouse(point)

/// <summary>

/// 마우스 아래 노드 찾기

/// </summary>

/// <param name="point">포인트</param>

private void FindNodeUnderMouse(PointF point)

{

if(selectedNode != null)

{

this.selectedNode.Data.Selected = false;

this.statusLabel.Text = string.Empty;

}

using(Graphics graphics = this.canvasPictureBox.CreateGraphics())

{

this.selectedNode = this.rootNode.GetNode(graphics, point);

}

if(this.selectedNode != null)

{

this.selectedNode.Data.Selected = true;

this.statusLabel.Text = this.selectedNode.Data.Description;

}

this.canvasPictureBox.Refresh();

}

#endregion

}

TestProject.zip

[C#/WPF] ScrollViewer 클래스 : ScrollChanged 이벤트를 사용해 그리드 컨트롤 흉내내기

■ ScrollViewer 클래스의 ScrollChanged 이벤트를 사용해 그리드 컨트롤을 흉내내는 방법을 보여준다. ▶ MainWindow.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="ScrollViewer 클래스 : ScrollChanged 이벤트를 사용해 그리드 컨트롤 흉내내기"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*"    />
        </Grid.RowDefinitions>
        <ScrollViewer Name="headerScrollViewer"
            HorizontalScrollBarVisibility="Hidden"
            VerticalScrollBarVisibility="Hidden">
            <Grid Background="Beige">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="100" SharedSizeGroup="column1" />
                    <ColumnDefinition Width="100" SharedSizeGroup="column2" />
                    <ColumnDefinition Width="100" SharedSizeGroup="column3" />
                    <ColumnDefinition Width="100" SharedSizeGroup="column4" />
                    <ColumnDefinition Width="100" SharedSizeGroup="column5" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="25" />
                </Grid.RowDefinitions>
                <Border Grid.Column="0"
                    BorderThickness="1"
                    BorderBrush="DarkGray">
                    <TextBlock
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Foreground="Black">헤더 1
                    </TextBlock>
                </Border>
                <Border Grid.Column="1"
                    BorderThickness="1"
                    BorderBrush="DarkGray">
                    <TextBlock
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Foreground="Black">헤더 2
                    </TextBlock>
                </Border>
                <Border Grid.Column="2"
                    BorderThickness="1"
                    BorderBrush="DarkGray">
                    <TextBlock
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Foreground="Black">헤더 3
                    </TextBlock>
                </Border>
                <Border Grid.Column="3"
                    BorderThickness="1"
                    BorderBrush="DarkGray">
                    <TextBlock
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Foreground="Black">헤더 4
                    </TextBlock>
                </Border>
                <Border Grid.Column="4"
                    BorderThickness="1"
                    BorderBrush="DarkGray">
                    <TextBlock
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Foreground="Black">헤더 5
                    </TextBlock>
                </Border>
                <FrameworkElement Grid.Column="5"
                    Width="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}" />
            </Grid>
        </ScrollViewer>
        <ScrollViewer Name="contentScrollViewer" Grid.Row="1"
            HorizontalScrollBarVisibility="Auto"
            VerticalScrollBarVisibility="AUto">
            <Grid Name="contentGrid" Background="White">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="100" SharedSizeGroup="column1" />
                    <ColumnDefinition Width="100" SharedSizeGroup="column2" />
                    <ColumnDefinition Width="100" SharedSizeGroup="column3" />
                    <ColumnDefinition Width="100" SharedSizeGroup="column4" />
                    <ColumnDefinition Width="100" SharedSizeGroup="column5" />
                </Grid.ColumnDefinitions>
            </Grid>
        </ScrollViewer>
    </Grid>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="800"

Height="600"

Title="ScrollViewer 클래스 : ScrollChanged 이벤트를 사용해 그리드 컨트롤 흉내내기"

FontFamily="나눔고딕코딩"

FontSize="16">

<Grid>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<ScrollViewer Name="headerScrollViewer"

HorizontalScrollBarVisibility="Hidden"

VerticalScrollBarVisibility="Hidden">

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Border Grid.Column="0"

BorderThickness="1"

BorderBrush="DarkGray">

<TextBlock

HorizontalAlignment="Center"

VerticalAlignment="Center"

Foreground="Black">헤더 1

</TextBlock>

</Border>

<Border Grid.Column="1"

BorderThickness="1"

BorderBrush="DarkGray">

<TextBlock

HorizontalAlignment="Center"

VerticalAlignment="Center"

Foreground="Black">헤더 2

</TextBlock>

</Border>

<Border Grid.Column="2"

BorderThickness="1"

BorderBrush="DarkGray">

<TextBlock

HorizontalAlignment="Center"

VerticalAlignment="Center"

Foreground="Black">헤더 3

</TextBlock>

</Border>

<Border Grid.Column="3"

BorderThickness="1"

BorderBrush="DarkGray">

<TextBlock

HorizontalAlignment="Center"

VerticalAlignment="Center"

Foreground="Black">헤더 4

</TextBlock>

</Border>

<Border Grid.Column="4"

BorderThickness="1"

BorderBrush="DarkGray">

<TextBlock

HorizontalAlignment="Center"

VerticalAlignment="Center"

Foreground="Black">헤더 5

</TextBlock>

</Border>

<FrameworkElement Grid.Column="5"

Width="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}" />

</Grid>

</ScrollViewer>

<ScrollViewer Name="contentScrollViewer" Grid.Row="1"

HorizontalScrollBarVisibility="Auto"

VerticalScrollBarVisibility="AUto">

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

</Grid>

</ScrollViewer>

</Grid>

</Window>

▶ MainWindow.xaml.cs


using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            this.Loaded                            += Window_Loaded;
            this.contentScrollViewer.ScrollChanged += contentScrollViewer_ScrollChanged;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region 윈도우 로드시 처리하기 - Window_Loaded(sender, e)

        /// <summary>
        /// 윈도우 로드시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            for(int y = 0; y < 1000; y++)
            {
                RowDefinition rowDefinition = new RowDefinition();

                rowDefinition.Height = new GridLength(25d, GridUnitType.Pixel);

                this.contentGrid.RowDefinitions.Add(rowDefinition);
            }

            for(int y = 0; y < 1000; y++)
            {
                for(int x = 0; x < 5; x++)
                {
                    TextBlock textBlock = new TextBlock();

                    textBlock.Margin     = new Thickness(3);
                    textBlock.Foreground = Brushes.Black;
                    textBlock.Text       = string.Format("셀({0},{1})", y, x);

                    Border border = new Border();

                    border.BorderThickness = new Thickness(0.5);
                    border.BorderBrush     = Brushes.DarkGray;

                    border.Child = textBlock;

                    Grid.SetRow   (border, y);
                    Grid.SetColumn(border, x);

                    this.contentGrid.Children.Add(border);
                }
            }
        }

        #endregion
        #region 컨텐트 스크롤 뷰어 스크롤 변경시 처리하기 - contentScrollViewer_ScrollChanged(sender, e)

        /// <summary>
        /// 컨텐트 스크롤 뷰어 스크롤 변경시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void contentScrollViewer_ScrollChanged(object sender, ScrollChangedEventArgs e)
        {
            this.headerScrollViewer.ScrollToHorizontalOffset(this.contentScrollViewer.ContentHorizontalOffset);
        }

        #endregion
    }
}

using System.Windows;

using System.Windows.Controls;

using System.Windows.Media;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

this.Loaded += Window_Loaded;

this.contentScrollViewer.ScrollChanged += contentScrollViewer_ScrollChanged;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 윈도우 로드시 처리하기 - Window_Loaded(sender, e)

/// <summary>

/// 윈도우 로드시 처리하기

/// </summary>

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

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

private void Window_Loaded(object sender, RoutedEventArgs e)

{

for(int y = 0; y < 1000; y++)

{

RowDefinition rowDefinition = new RowDefinition();

rowDefinition.Height = new GridLength(25d, GridUnitType.Pixel);

this.contentGrid.RowDefinitions.Add(rowDefinition);

}

for(int y = 0; y < 1000; y++)

{

for(int x = 0; x < 5; x++)

{

TextBlock textBlock = new TextBlock();

textBlock.Margin = new Thickness(3);

textBlock.Foreground = Brushes.Black;

textBlock.Text = string.Format("셀({0},{1})", y, x);

Border border = new Border();

border.BorderThickness = new Thickness(0.5);

border.BorderBrush = Brushes.DarkGray;

border.Child = textBlock;

Grid.SetRow (border, y);

Grid.SetColumn(border, x);

this.contentGrid.Children.Add(border);

}

#endregion

#region 컨텐트 스크롤 뷰어 스크롤 변경시 처리하기 - contentScrollViewer_ScrollChanged(sender, e)

/// <summary>

/// 컨텐트 스크롤 뷰어 스크롤 변경시 처리하기

/// </summary>

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

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

private void contentScrollViewer_ScrollChanged(object sender, ScrollChangedEventArgs e)

{

this.headerScrollViewer.ScrollToHorizontalOffset(this.contentScrollViewer.ContentHorizontalOffset);

}

#endregion

}

TestProject.zip