Silverlight 3 & Blend 3 RC 공개!!!

RIA 2009.07.10 01:50 Posted by 비회원


Silverlight 3 정식버전이 드디어 공개됐습니다. 현지 시간으로 7월 10일에 공개된다는 기사가 있었는데 약간 일찍 나왔습니다.
Blend 3도 공개됐는데 RC라고 붙은거 보니 아직 완전 정식판은 아닌 것 같네요.
그래도 이번에는 SketchFlow까지 포함되어서 MIX09에서 보여 주었던 모든 기능을 사용 할 수 있습니다.
Deep Zoom Composer도 역시 Silverlight 3에 맞게 업데이트 되었습니다.

아래 링크에서 다운받을 수 있습니다.
Silverlight 3 Tools 설치하시면 SDK도 같이 설치되니 한번에 설치 하실 분들은 참고하세요.

신고

Visual Studio 2010 Beta 1이 일반에 공개된지도 벌써 한달이 다 되갑니다.
미래의 Visual Studio의 모습을 보기 위해 설치 해서 사용을 해보신 분들도 있으시겠지만 시간이 없거나 아직 Beta 1 단계라서 완성되지 않은 부분이 있어서 다음 기회에 사용 해보시려는 분들도 있으실겁니다.
설치 과정을 보면서 어떠한 구성요소가 업데이트 되었고 설치가 되는지 알아보고 기본적으로 변화된 IDE의 모습을 살펴보겠습니다.



먼저 오토런 화면입니다.
첫번째 인스톨 메뉴를 선택하고 설치를 시작 해 보겠습니다.



기본적인 설치 파일 작업이 끝나고 다음으로 넘어갑니다.



현재 설치되어 있는 구성 요소를 체크 하고 설치 될 요소를 알려줍니다.
VC 런타임이 9.0과 10.0 두개가 모두 설치되는 것을 볼 수 있습니다.
그리고 핵심이 되는 .NET Framework 4 Beta 1과 Visual Studio 2010 Beta 1 등이 설치 되는 것을 알 수 있습니다.
그럼 라이센스에 동의를 하고 다음으로 넘어갑니다.



지금까지는 이전과 별 다를건 없었는데 여기서 약간 달라집니다.
기존에는 전체 구성요소가 트리 구조로 한번에 나왔는데 이제 바로 나오지 않고
.NET 개발 환경과 C++ 개발 환경으로 나뉘어져 있습니다.
자신의 개발 환경에 맞게 선택을 할 수 있고 체크를 한 후 아래 보이는 Customize 버튼을 누르면 세부 선택이 가능합니다.



보시는 것처럼 이전과 같이 트리 구조로 선택 할 수 있게 나오게 되고 원하는 형태로 설치가 가능합니다.
그리고 SQL Server 2008 Express 버전이 기본적으로 선택이 됩니다.
Install 버튼을 눌러 설치를 시작하겠습니다.



.NET Framework 4 Beta 1이 설치되면 재부팅을 요구합니다. 재부팅을 하고나면 나머지 설치 과정을 이어서 진행합니다.



드디어 설치가 완료되었습니다. Windows Server 2008 SP2 VPC에서 설치를 진행했는데 중간에 디지털 서명 관련 에러가 나서 재부팅하고 다시 하니 잘 설치되었습니다.
혹시 비슷한 에러나 나면 참고하세요.

그리고 설치되는 MSDN은 베타1에 포함되지 않았습니다. 온라인 MSDN 라이브러리에서 2010에 관련된 내용을 확인 할 수 있습니다.


제어판에서 설치된 목록을 보면 다음과 같습니다.
현재 베타1 단계에서는 이정도가 설치되고 앞으로 베타2 이후에는 변화 될 수도 있습니다.



시작 메뉴에 등록된 프로그램은 다음과 같습니다. Microsoft Test and Lab Manager 등 새롭게 추가된 요소를 볼 수 있습니다.




VS2010 베타1을 실행 해 보면 시작 페이지가 많이 달라진것을 볼 수 있습니다.
전체적인 IDE에도 색도 들어가고 화려한 모습을 보여주고 있습니다.




About 메뉴에서 구성 요소를 다시 한번 보면 Silverlight도 기본으로 추가된것을 볼 수 있고 F# 등 새로운 언어도 포함되었습니다.


새 프로젝트를 열어보면 이전과 조금 다른 형태가 보입니다.
2008에서 처럼 멀티 타겟팅을 지원하고 업그레이드 된 .NET Framework 4.0도 보입니다.



F# 프로젝트 템플릿은 다음과 같습니다. .NET Framework 4.0에서 새롭게 지원하는 것이므로 3.5 이하를 선택하면 나타나지 않습니다.



새롭게 추가된 온라인 템플릿 탭을 선택하면 기본 템플릿 외에 다양한 템플릿을 추가 할 수 있습니다.



WPF 프로젝트를 생성 해 보았습니다. 전체적인 IDE가 푸른색을 기본으로 새롭게 변화되었고 WPF로 구성되었다는걸 느낄 수 있습니다.
그런데 WPF에서 폰트 처리 문제때문에 좀 뿌옇게 보이는 경향이 있는데 앞으로 개선될거라 예상됩니다.



Visual Studio 2010에서는 멀티 모니터를 지원 한다고 하는데 보시는 것처럼 탭으로 분류된 창을 분리 할 수 있습니다. 창을 드래그 해서 다른 모니터로 옮겨서 여러 모니터에서 작업을 할 수 있습니다.

지금까지 설치부터 IDE의 모습까지 간략히 살펴보았는데 여러가지 향상된 점이 많다는 것을 알 수 있습니다.
관심 있으신 분들은 설치해서 사용 해보시가 여건이 안되신다면 궁금한 점을 말씀하시면 더 자세히 알려드리도록 하겠습니다.

신고

Windows 7을 위한 Windows XP 모드

Windows 7 2009.04.27 19:29 Posted by 비회원
Windows XP 모드는 Windows 7 기반 PC에서 Windows XP 어플리케이션을 사용할 수 있습니다.
Windows XP에서 Windows 7 환경으로 이행하려는 기업을 목적으로 개발했다고 하는데 일반 사용자에게도 많은 도움이 될 것 같습니다.


공개된 스크린샷을 보면 Windows 7 환경에서 XP 어플리케이션이 자연스럽게 구동되는것을 볼 수 있습니다. (에어로 테마가 아닌 XP의 루나 테마로 확인 할 수 있습니다.)

Windows Virtual PC의 Windows XP 환경에서 가상으로 동작하게 되며 호환성 문제의 고민을 해결합니다. 현재 아직 공개되지는 않았고 조만간 베타버전이 선보인다고 하는데 이후에 자세한 내용을 알아보도록 하겠습니다.

현재 공개된 정보는 아래 링크에서 자세히 확인 할 수 있습니다.
Windows XP Mode for Windows 7 Screens
Revealing Windows XP Mode for Windows 7
신고

WPF Features Preview (3) - Styling the DataGrid

WPF 2009.04.23 03:55 Posted by 비회원
WPF Features Preview (1) - DataGrid
WPF Features Preview (2) - DatePicker 

맨 처음 초기 어플리케이션을 보면 스타일이 적용되어 멋지게 보입니다. DataGrid를 적용하여 수정된 버전은 좀 더 기능적이긴 하지만 밋밋하고 보기엔 좀...
이번에는 DataGrid에 스타일을 주어서 컬러풀하고 비주얼적으로 멋지게 만들어 보도록 하겠습니다.

프로젝트를 열고 MainWindow.xaml 파일을 열어서 DockPanel 부분을 보면 뭔가 스타일이 적용된것을 볼 수 있습니다. 이 중에서 몇가지 brushGridViewColumnHeaderListViewItem 스타일을 DataGrid 스타일에 적용해 보도록 하겠습니다.

DataGrid의 스타일 프로퍼티
1. CellStyle - 각각의 cell에 사용되는 스타일 (DataGridCell)
2. RowStyle - row에 사용되는 스타일 (DataGridRow)
3. ColumnHeaderStyle - header bar에 사용되는 스타일 (DataGridColumnHeader)

사용자가 grid와 상호작용하는 것에 대한 프로퍼티
1. SelectionMode - 단일선택과 확장된 선택에 대한 모드
2. SelectionUnit - 무엇이 선택되는가에 대한 설정 (FullRow vs Cell vs CellOrRowHeader)
3. GridLinesVisibility - cell 주변의 라인에 대한 속성
4. VerticalGridLinesBrush - 수직 라인에 대한 색상
5. HorizontalGridLinesBrush - 수평 라인에 대한 색상

먼저 TargetType으로 스타일이 적용될 타입에 대해 설정해줍니다.
TargetType 값에 GridViewColumnHeaderdg:DataGridColumnHeader로 바꿔줍니다.
그리고 ListViewItemdg:DataGridRow로 바꿔줍니다.
변경된 xaml 코드는 아래와 같습니다.

   <Style x:Key="dgHeaderStyle" TargetType="dg:DataGridColumnHeader">

      <Setter Property="Background" Value="{StaticResource dgHeaderBrush}" />

      <Setter Property="Foreground" Value="White" />

      <Setter Property="BorderBrush" Value="{StaticResource dgHeaderBorderBrush}" />

   </Style>

   <Style x:Key="dgRowStyle" TargetType="dg:DataGridRow">

      <Setter Property="SnapsToDevicePixels" Value="True" />

      <Setter Property="Background" Value="White" />

      <Style.Triggers>

         <Trigger Property="ItemsControl.AlternationIndex" Value="1">

            <Setter Property="Background" Value="#FFD0D0E0" />

         </Trigger>

         <Trigger Property="IsSelected" Value="True">

            <Setter Property="Background" Value="LightGoldenrodYellow" />

         </Trigger>

      </Style.Triggers>

   </Style>

DataGrid가 정의된 곳에는 ColumnHeaderStyleRowStyle 속성을 설정해줍니다.

        <dg:DataGrid x:Name="dg" ItemsSource="{Binding}" Margin="10"

                  AutoGenerateColumns="False"

                  Background="#80909090" AlternationCount="2"

                  ColumnHeaderStyle="{StaticResource dgHeaderStyle}"

                  RowStyle="{StaticResource dgRowStyle}">

이제 어플리케이션을 실행해보면 스타일이 적용되어 이전과 다른 모습을 볼 수 있습니다.

이제 몇가지 grid에 대한 속성을 주도록 하겠습니다.
1. Extended 선택 모드 적용
2. SelecionUnitFullRow로 설정
3. GridLinesVisibilityAll로 설정
4. VerticalGridLinesBrushDarkGray로 설정

        <dg:DataGrid x:Name="dg" ItemsSource="{Binding}" Margin="10"

                  AutoGenerateColumns="False"

                  Background="#80909090" AlternationCount="2"

                  ColumnHeaderStyle="{StaticResource dgHeaderStyle}"

                  RowStyle="{StaticResource dgRowStyle}"

                  SelectionMode="Extended"

                  SelectionUnit="FullRow"

                  GridLinesVisibility="All"

                  VerticalGridLinesBrush="DarkGray">

또 몇가지 설정을 해서 header 스타일을 주도록 해보겠습니다.
1. BorderTickness1로 주어서 border를 볼 수 있도록
2. pixel snapping을 활성화 (SnapsToDevicePixels="True")
3. 컨텐트 horizontal 정렬 (HorizontalContentAlignment="Center")
4. MinWidth="0" MinHeight="30" 으로 설정
5. 기본 커서 모양을 Hand로 설정

  <Style x:Key="dgHeaderStyle" TargetType="dg:DataGridColumnHeader">

     <Setter Property="Background" Value="{StaticResource dgHeaderBrush}" />

     <Setter Property="Foreground" Value="White" />

     <Setter Property="BorderBrush" Value="{StaticResource dgHeaderBorderBrush}" />

     <Setter Property="BorderThickness" Value="1" />

     <Setter Property="SnapsToDevicePixels" Value="True" />

     <Setter Property="HorizontalContentAlignment" Value="Center" />

     <Setter Property="MinWidth" Value="0" />

     <Setter Property="MinHeight" Value="30" />

     <Setter Property="Cursor" Value="Hand" />

  </Style>

다시 컴파일해서 실행해보면 좀 더 직관적으로 보기 쉽게 스타일 적용이 된 것을 볼 수 있습니다.


다음으로는 Cell 자체에 대한 스타일 적용을 해보겠습니다. Cell의 컨텐트가 가운데로 오고 필요할 때 포커스가 적용되면 좀 더 편리할 것 같은데 이것을 해보도록 하겠습니다.



새로운 스타일 속성을 DockPanel.Resources에 추가하도록 합니다.
1. TargetTypedg:DataGridCell로 설정
2. 중요한 속성은 기본 DataGridCell을 따르기 위해 BasedOn 프로퍼티 설정
   "{StaticResource{x:Type dg:DataGridCell}}"

3. SnapsToDevicePixels"True"로 설정
4. VerticalAlignment"Center"로 설정
5. Trigger 컬렉션 추가 - 셀이 선택되었을 때 background/foreground 색상 변경
6. <Style.Triggers> 부분에 IsSelected 프로퍼티를 True로 설정하고
    a. BackgroundTransparent
    b. BorderBrushTransparent
    c. ForegroundBlack으로
7. 두번째 trigger를 추가하고 IsKeyboardFocusWithin="True" 프로퍼티에
    a. Background"{StaticResource whiteBackBrush}" 리소스
    b. BorderBrush"{DynamicResource{x:Static dg:DataGrid.FocusBorderBrushKey}}" 리소스
    c. ForegroundBlack

    <Style x:Key="dgCellStyle" TargetType="dg:DataGridCell"

           BasedOn="{StaticResource {x:Type dg:DataGridCell}}">

       <Setter Property="SnapsToDevicePixels" Value="True" />

       <Setter Property="VerticalAlignment" Value="Center" />

       <Style.Triggers>

          <Trigger Property="IsSelected" Value="True">

             <Setter Property="Background" Value="Transparent" />

             <Setter Property="BorderBrush" Value="Transparent" />

             <Setter Property="Foreground" Value="Black" />

          </Trigger>

          <Trigger Property="IsKeyboardFocusWithin" Value="True">

             <Setter Property="Background" Value="{StaticResource whiteBackBrush}" />

             <Setter Property="BorderBrush"

                  Value="{DynamicResource {x:Static dg:DataGrid.FocusBorderBrushKey}}" />

             <Setter Property="Foreground" Value="Black" />

          </Trigger>

       </Style.Triggers>

    </Style>

그리고 DataGrid 속성에 CellStyle 프로퍼티값을 줍니다.

        <dg:DataGrid x:Name="dg" ItemsSource="{Binding}" Margin="10"

                  AutoGenerateColumns="False"

                  Background="#80909090" AlternationCount="2"

                  ColumnHeaderStyle="{StaticResource dgHeaderStyle}"

                  RowStyle="{StaticResource dgRowStyle}"

                  CellStyle="{StaticResource dgCellStyle}"

                  SelectionMode="Extended"

                  SelectionUnit="FullRow"

                  GridLinesVisibility="All"

                  VerticalGridLinesBrush="DarkGray">

이제 Cell을 클릭해보면 색이 적용되어 하이라이트 되는것을 볼 수 있습니다.

마지막으로 RowDetail 속성을 설정하도록 하겠는데 위에서 했던 방법과 비슷하니 자세한 설명은 생략하겠습니다. xaml 코드를 보면 어렵지 않게 이해 할 수 있을 것입니다.

    <dg:DataGrid x:Name="dg" ItemsSource="{Binding}" Margin="10" ...

        VerticalGridLinesBrush="DarkGray"

        RowDetailsVisibilityMode="VisibleWhenSelected">

 

            <dg:DataGrid.RowDetailsTemplate>

                <DataTemplate>

                    <StackPanel Orientation="Horizontal" Margin="20,0,0,0">

                        <TextBlock />

                        <TextBox />

                    </StackPanel>

                </DataTemplate>

            </dg:DataGrid.RowDetailsTemplate>

TextBlock 속성

       <StackPanel Orientation="Horizontal" Margin="20,0,0,0">

          <TextBlock Text="Category:" VerticalAlignment="Center" FontWeight="Bold" />

          <TextBox />

TextBox 생성

      <dg:DataGrid.RowDetailsTemplate>

         <DataTemplate>

            <StackPanel Orientation="Horizontal" Margin="20,0,0,0">

               <TextBlock Text="Category:" VerticalAlignment="Center" FontWeight="Bold" />

               <TextBox Text="{Binding Category}" Margin="10,5" MinWidth="100">

                  <TextBox.Style>

                     <Style TargetType="TextBox">

                        <Setter Property="BorderBrush" Value="{x:Null}" />

                        <Setter Property="Background" Value="{x:Null}" />

                        <Style.Triggers>

                           <Trigger Property="IsFocused" Value="True">

                              <Setter Property="BorderBrush"

                                      Value="{x:Static SystemColors.WindowFrameBrush}" />

                              <Setter Property="Background"

                                      Value="{x:Static SystemColors.WindowBrush}" />

                           </Trigger>

                           <Trigger Property="IsMouseOver" Value="True">

                              <Setter Property="BorderBrush"

                                      Value="{x:Static SystemColors.WindowFrameBrush}" />

                              <Setter Property="Background"

                                      Value="{x:Static SystemColors.WindowBrush}" />

                           </Trigger>

                        </Style.Triggers>

                     </Style>

                  </TextBox.Style>

               </TextBox>

            </StackPanel>

         </DataTemplate>

            </dg:DataGrid.RowDetailsTemplate>

이제 모든 스타일 적용이 끝났습니다. 실행을 해보면 위에서 적용한 스타일이 적용되어 처음의 DataGrid보다 훨씬 보기도 좋고 스타일이 좋아진것을 알 수 있습니다.



지금까지 DataGrid에 대해 알아보았는데 다음에는 역시 새롭게 추가된 Ribbon 컨트롤에 대해 알아보겠습니다.
WPF에서도 기존의 메뉴와 툴바를 벗어나서 새로운 Ribbon 스타일을 적용할 수 있는데 이것 역시 어렵지 않게 할 수 있으니 기대해주세요.

신고

WPF Features Preview (2) – DatePicker

WPF 2009.04.22 16:50 Posted by 비회원

WPF Features Preview (1) - DataGrid

저번 시간에는 WPFToolkit을 이용해서 ListView를 DataGrid로 바꿔보았습니다. 훨씬 간편하고 쉽게 데이터를 보여줄 수 있다는것을 알았는데요 이번에는 WPFToolkit에 포함된
(WPF 4.0에는 기본으로 포함) 다른 컨트롤들을 이용해서 좀 더 DataGrid를 강화해 보겠습니다.

XAML 파일을 열고 DataGrid 아래에 보면 DataGridTextColumn 부분에 날짜가 표현되는 것을 볼 수 있습니다. 이 부분을 헤더는 그대로 두고 MinWidth 속성에 100으로 고정값을 주도록 하겠습니다.
그리고 template column에서 CellEditingTemplate을 생성합니다.

이제부터 중요한 작업을 하겠는데 기존에 그냥 날짜가 표시되는것을 DatePicker 컨트롤을 이용해서 표현해보겠습니다.
DataTemplate을 생성 한 후 WPFToolkitDatePicker 컨트롤을 추가해줍니다. DataGrid와 같은 네임스페이스에 있으니 따로 추가적인 작업은 필요하지 않습니다.
SelectedDate 속성에서 Date 프로퍼티를 바인딩해주고 SelectedDateFormat 프로퍼티에서 Short 값을 주어 포맷을 정합니다.
CellTemplate 프로퍼티에서는 TextBlock을 이용해서 Date 프로퍼티를 바인딩해주고 StringFormat에 d 값을 주어서 DateTime 포맷으로 해줍니다.
이렇게 해서 수정된 XAML은 아래와 같습니다.

  <!--<dg:DataGridTextColumn Header="Date" Binding="{Binding Date, StringFormat=d}" />-->

  <dg:DataGridTemplateColumn Header="Date" MinWidth="100">

     <dg:DataGridTemplateColumn.CellEditingTemplate>

        <DataTemplate>

           <dg:DatePicker SelectedDate="{Binding Date}" SelectedDateFormat="Short" />

        </DataTemplate>

     </dg:DataGridTemplateColumn.CellEditingTemplate>

     <dg:DataGridTemplateColumn.CellTemplate>

        <DataTemplate>

           <TextBlock Text="{Binding Date, StringFormat=d}" />

        </DataTemplate>

     </dg:DataGridTemplateColumn.CellTemplate>

  </dg:DataGridTemplateColumn>

이제 어플리케이션을 실행해보면 새로운 DatePicker 컨트롤이 나오는것을 볼 수 있고 달력을 클릭해서 값을 수정할 수 있는 모드가 나옵니다.

간단하게 새로운 컨트롤을 이용해서 좀 더 직관적인 데이터 표현을 할 수 있는것을 보았습니다. 컨트롤 사용법과 데이터 바인딩 방법만 익히면 다른 부분에도 쉽게 적용할 수 있을것입니다.
다음에는 DataGridStyle 속성을 이용하여 기본적인 DataGrid를 좀 더 보기 좋게 만드는 방법을 알아보도록 하겠습니다.


신고

WPF Features Preview (1) – DataGrid

WPF 2009.04.17 20:32 Posted by 비회원

WPF 4에서는 새로운 컨트롤들이 포함되게 되는데 대표적으로 DataGrid, Ribbon, VIsual State Manager 컨트롤이 있습니다.
WPF Features Privew를 통해서 새로운 컨트롤들을 미리 보는 시간을 가져보겠습니다.

Exercise 1 - Using the new WPF DataGrid

먼저 기존에 있는 Checkbook 어플리케이션을 살펴보면 ListView를 이용해서 DataGrid 형태로 사용하는 것을 볼 수 있습니다.
이번 실습에서는 몇가지 단계를 따르게 되는데 다음과 같습니다.

1. DataGrid 어셈블리 추가 (WPF Toolkit)
2. ListView와 GridView를 DataGrid로 교체
3. 스타일과 템플릿 변형

먼저 WPF 어플리케이션을 실행해보면 몇가지 데이터가 바인딩된 어플리케이션 형태를 볼 수 있습니다.

Task 1 - Examine the existing application

CheckbookManager 어플리케이션을 Visual Studio를 이용해서 열어서 살펴보면 어떤 형태로 동작하는지 쉽게 알 수 있습니다.
이제 소스코드를 살펴보면 메인 윈도우인 MainWindow.xaml에 보면 ListView가 정의된것을 볼 수 있습니다. 스타일과 컬럼 효과를 이용해서 형태를 정의하고 있는데 column definition은 템플릿을 필요로 하게 됩니다. 왜냐하면 기본적인 ListView 컬럼은 읽기 전용 속성이기 때문입니다.
이것을 TextBox를 이용해서 DataGrid처럼 표현하고 있는것을 볼 수 있습니다.
Data 폴더에 보면 자료구조가 정의되어 있는데 여기서 살펴볼것은 아니니 그냥 넘어가도록 하겠습니다.

Task 2 - Using the DataGrid

이번 단계에서는 ListView를 WPF DataGrid로 교체해보도록 하겠습니다.
먼저 DataGrid를 포함하고 있는 WPFToolkit 어셈블리를 참조합니다.


참조 추가를 선택하고 WPFToolkit.dll 파일을 선택해주면 됩니다.

그리고 나서 MainWindow.xaml 상단에 보면 네임스페이스가 정의된 부분이 있는데 여기에 WPF Toolkit을 추가해줍니다.


접두어를 붙여주고 Microsoft.Windows.Controls 네임스페이스를 선택해주면 WPFToolkit이 등록됩니다.

스크롤을 좀 더 내려서 XAML을 살펴보면 ListView가 있는데 ListView를 dg:DataGrid로 바꿔서 DataGrid 컨트롤을 사용할 수 있게 해줍니다.
물론 바꾸고 나면 많은 에러가 나게 되는데 이것은 차차 고쳐 나갈것입니다.
그리고 ItemContainerStyle 속성을 지워줍니다. 이것은 나중에 다시 해줄텐데 우선 지우도록 하겠습니다.

그리고 TextBox 스타일 리소스 역시 지워줍니다. 우리는 새로운 데이타 컬럼 타입을 사용하게 되니 더 이상필요하지 않습니다.
ListView의 ContextMenu 속성 역시 dg:DataGrid로 바꿔줍니다.
이렇게 해주면 다음과 같은 XAML 형태를 가지게 됩니다.

<!-- DataGrid fills remainder of space -->

<dg:DataGrid x:Name="dg" ItemsSource="{Binding}" Margin="10"

             Background="#80909090" AlternationCount="2">

   <dg:DataGrid.ContextMenu >

      <ContextMenu >

         <MenuItem Header="Copy Selected Transactions"

                   Command="{x:Static ApplicationCommands.Copy}" />

      </ContextMenu>

   </dg:DataGrid.ContextMenu>

   <!-- <ListView.View> ...

        </ListView.View> -->

</dg:DataGrid>

이제 어플리케이션을 컴파일하고 다시 실행시켜 보면 DataGrid가 자동적으로 컬럼을 생성해서 데이터를 보여주는것을 볼 수 있습니다.

다시 소스코드로 돌아와서 컬럼 타입을 정의해주도록 하겠습니다.
DataGrid 안에 <dg:DataGrid.Columns>를 추가 해 줍니다.
그리고 <dg:DataGridTextColumn> 요소를 위의 컬럼 컬렉션 안에 추가 해 줍니다.

Header 프로퍼티는 Header 텍스트값의 속성이고 Width는 컬럼의 폭을 정할 수 있는데 고정값을 줄 수도 있고 컬럼의 헤더나 셀 사이즈에 맞게 해줄 수도 있습니다.
마지막으로 컬럼에 데이터 바인딩을 해줘야 하는데 Binding 속성을 이용해서 ListView에서 해줬던것 처럼 같은 방식으로 해주면 됩니다.

<dg:DataGrid x:Name="dg" ItemsSource="{Binding}" Margin="10"

                  Background="#80909090" AlternationCount="2">

 

            <dg:DataGrid.Columns>

                <dg:DataGridTextColumn Header="No." Width="SizeToCells"  

                                       Binding="{Binding CheckNumber}" />

            </dg:DataGrid.Columns>

여기까지 하고 실행을 해보면 새로 정의해준 컬럼이 추가되긴 했지만 기존 컬럼이 그대로 남아있는것을 볼 수 있습니다.
DataGrid 속성중에 AutoGenerateColumns라는 속성이 기본적으로 True값을 가지게 되어 이렇게 되는데 이 속성을 False로 바꿔주면 정의된 컬럼만 나타나게 됩니다.

<dg:DataGrid x:Name="dg" ItemsSource="{Binding}" Margin="10"

                  AutoGenerateColumns="False"

                  Background="#80909090" AlternationCount="2">

그리고 나머지 컬럼들에 대해서도 속성을 정의해주면 됩니다.

DataGridCheckBoxColumn
DataGridComboBoxColumn
DataGridHyperlinkColumn
DataGridTextColumn
DataGridTemplateColumn

이름을 보면 알 수 있듯이 DataGrid 안에서 일반 컨트롤과 같은 역할을 하게 됩니다.
이러한 컬럼 스타일을 이용해서 원하는 데이터에 맞게 설정을 해주면 초기의 ListVIew에서 보여줬던 형태를 DataGrid로 만들 수 있습니다.

최종 DataGrid 소스 코드

여기까지 마치고 실행해보면 정의해준 컬럼 스타일에 맞게 데이터가 바인딩되어 보이게 됩니다.
지금까지 WPF Toolkit을 이용해서 DataGrid를 추가하고 컬럼 속성 스타일을 주어서 데이타 바인딩하는 방법까지 살펴보았습니다.
다음에는 여기에 추가해서 Calendar와 DatePicker 컨트롤을 이용해서 데이터 필드를 구성하는것에 대해 보도록 하겠습니다.

참고자료
WPF Toolkit : http://www.codeplex.com/wpf

신고

Windows SDK 설치 후 XAML 인텔리센스 문제

Windows 7 2009.04.16 22:50 Posted by 비회원

Windows SDK 설치 후 XAML을 사용하는 프로젝트에서 인텔리센스가 동작하지 않는 문제가 있습니다.
Windows SDK가 설치 된 후 Visual Studio의 레지스트리 값이 변경되어 관련된 dll 파일  연결이 깨져버린 현상입니다. 

regedit 명령어를 이용해서 레지스트리 편집기를 연 후 다음 키를 살펴봅니다. 

x86
 HKEY_CLASSES_ROOT\CLSID\{73B7DC00-F498-4ABD-AB79-D07AFD52F395}\InProcServer32 

x64
 HKEY_CLASSES_ROOT\Wow6432Node\CLSID\{73B7DC00-F498-4ABD-AB79-D07AFD52F395}\InProcServer32 

이 항목이 없다면 인텔리센스 문제가 생길 것입니다. 

두 가지 해결 방법이 있는데 제어판의 프로그램 추가/삭제에서 Visual Studio 2008을 복구 하거나
수동으로 dll 파일을 등록해주면 됩니다. 

수동으로 dll 파일 연결 방법은 다음과 같으니 시스템에 맞게 해주시면 됩니다. 

x86
 regsvr32 "%CommonProgramFiles%\Microsoft Shared\MSEnv\TextMgrP.dll" 

x64
 regsvr32 "%CommonProgramFiles(X86)%\Microsoft Shared\MSEnv\TextMgrP.dll" 

이렇게 해주고 다시 확인해보면 인텔리센스가 정상적으로 작동하는 것을 확인 할 수 있습니다.


신고

WPF 4의 향상된 기능과 Windows 7 지원

WPF 2009.04.09 02:33 Posted by 비회원

WPF가 발표된지도 많은 시간이 흘렀지만 아직 WPF를 사용한 어플리케이션이 많이 나오지 않는 것이 현실입니다. 앞으로 Visual Studio 2010과 .NET Framework 4.0이 발표되면 WPF 역시 4.0으로 버전업이 되는데 이제 현실적으로 많이 사용 될 수 있을 정도로 많은 발전이 있습니다. 

알려진 바와 같이 Visual Studio 2010 IDE에서도 WPF가 사용될 정도로 성능이나 여러 면에서 많은 발전이 있습니다.


이번 MIX09 행사의 WPF4 소개 세션 자료를 보면 매우 많은 요소가 향상된 것을 볼 수 있습니다.

이 중에서 가장 눈에 띄는 것은 아무래도 Multi-Touch 지원이 되겠는데 이 것은 Windows 7에서 기본으로 Multi-Touch를 지원 하게 됨으로써 WPF에서도 이를 활용한 어플리케이션 개발을 할 수 있게 되었습니다.

 

이 외에도 중요한 몇 가지를 보면 Windows 7에서 새롭게 바뀐 Taskbar와 Office 2007에서 사용된 Ribbon UI를 기본으로 지원하게 되고 다양한 새로운 컨트롤과 .NET Framework 4에서 향상된 언어 기능들도 추가 되었습니다. 

이런 향상된 기능들을 지원하기 위해 WPF에서 어떤 변화가 있는지 자세히 알아보도록 하겠습니다. 


Multi-Touch in WPF

 

UIElement 변화 

WPF 개발을 해보신 분들은 UIElement 클래스에 대해 잘 알고 계실겁니다. UIElement 클래스는 WPF의 가장 기본이 되는 최상위 기본 클래스인데 멀티터치 지원을 위해서 내부적으로 몇 가지 변화가 생겼습니다. 우선 기존의 이벤트로는 멀티 터치를 지원 할 수 없기 때문에 멀티터치와 제스처 인식을 위한 이벤트가 추가 되었습니다.

 

멀티터치 지원 컨트롤 

ScrollViewer 컨트롤의 경우 제스처 인식을 하도록 업데이트 되었고 다른 기본 컨트롤들도 멀티터치 지원을 위해 업데이트 되었습니다. 동시에 하나 이상의 포인트를 인식하기 위해 멀티캡쳐 기능도 지원하게 되었습니다. 이 외에도 ScatterView 같은 멀티터치를 위한 새로운 컨트롤도 추가 되었습니다.

 

Surface SDK 2.0 호환 

Sufrace SDK 2.0의 호환으로 Surface 컴퓨터의 멀티터치 어플리케이션 개발을 쉽게 할 수 있습니다.

WPF Taskbar Integration

 

Windows 7에서는 기존보다 향상된 태스크바를 제공하는데 이를 지원하기 위한 내용이 포함 되었습니다.

 

Windows API Code Pack for .NET

Windows 7에서 추가되거나 향상된 API들을 사용하기 위해서는 C, C++, COM API 같은 네이티브 코드를 사용해야 합니다. 그러나 C# 등의 매니지드 코드를 사용하는 닷넷 개발자에게는 이것이 어렵게 느껴 질 수 있습니다. 그렇다고 새로운 멋진 기능들을 포기하자니 아쉽고 네이티브 코드를 사용하자니 불편하고 좀 더 편하게 할 수 있는 방법은 없을까요?  

이러한 것을 해결 하기 위해 Microsoft에서는  Windows Vista Bridge project를 만들었는데 이것을 사용하면 매니지드 코드 개발자가 Windows API를 쉽게 사용 할 수 있습니다. 현재 최신 버전은 1.4인데 Restart and Recovery, Search, Power Awareness and other Shell integrations 같은 Windows Vista의 많은 유용한 기능들을 포함 하고 있습니다. 그러나 현재 버전은 Windows7의 기능들을 포함하고 있지는 않습니다. 

Windows7은 현재 베타가 공개되었고 조만간 RC버전이 나온다고 하는데 Windows 7의 API 지원을 위한  Windows API Code Pack for the .NET Library(이것은 Windows Vista Bridge의 새 이름)도 함께 개발중으로 같이 배포 될 예정입니다. 

현재는 Windows Vista Bridge에서 약간 수정된 버전으로 Windows 7 API 일부를 지원하는 샘플 라이브러리가 있는데 이것은 다음에 자세히 알아 보도록 하겠습니다. 

 

WPF Ribbon

Visual Studio 2008에서는 MFC를 사용하여 Ribbon UI를 개발 할 수 있습니다. 그런데 WPF에서는 기본적으로는 Ribbon UI를 지원하지 못하고 WPF Toolkit을 통해서 따로 지원하고 있는데 WPF 4에서는 Ribbon UI를 기본적으로 지원하게 됩니다. 

 

WPF Controls

윈도우 프로젝트에서 많이 쓰이는 컨트롤 중 하나가 데이터 그리드나 달력 컨트롤 등이 있는데 WPF 기본 컨트롤에서는 지원하지 않고 WPF Toolkit으로 따로 지원하고 있습니다. Ribbon과 마찬가지로 이것도 역시 WPF 4에서는 기본으로 포함되게 됩니다. 이 외에도 Silverlight에서 지원하고 있는 차트 컨트롤 등도 WPF에서 역시 지원하게 됩니다.


 

대표적으로 살펴 본 것 외에도 많은 변화가 있고 향상 되었습니다. 다음 포스팅 부터는 이번에 살펴본 것을 중심으로 실제로 어떻게 사용하고 구현하게 되는지 자세히 알아보도록 하겠습니다. 

앞으로 Visual Studio 2010과 WPF 4의 향상된 기능 많이 기대 해주세요 :)

신고