basquang™ on blogger

Thứ Hai, 13 tháng 7, 2009

WPF: Layouts (P5)

StackPanel: Sắp xếp các controls từ trên xuống dưới, hoặc từ trái qua phải tùy thuộc vào thuộc tính orientation của panel

<StackPanel Orientation="Horizontal">

        <Button>Button1</Button>

        <Button>Button2</Button>

        <StackPanel Orientation="Vertical">

            <Button>Button3</Button>

            <Button>Button4</Button>

        </StackPanel>

    </StackPanel>

Đặc điểm:

- Size của các control fit với nội dung của nó

- Không tự động sử dụng hết khoảng trống

- Có thể lồng giữa nhiều StackPanel với nhau hoặc với các layouts khác

Grid: Sắp xếp các controls theo các hàng và cột một cách cố định giống như là HTML

<Grid>

    <Grid.RowDefinitions>

        <RowDefinition />

        <RowDefinition />

        <RowDefinition />

    </Grid.RowDefinitions>

    <Grid.ColumnDefinitions>

        <ColumnDefinition />

        <ColumnDefinition />

        <ColumnDefinition />

    </Grid.ColumnDefinitions>

    <Button Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2">A</Button>

    <Button Grid.Row="0" Grid.Column="2">C</Button>

    <Button Grid.Row="1" Grid.Column="0" Grid.RowSpan="2">D</Button>

    <Button Grid.Row="1" Grid.Column="1">E</Button>

    <Button Grid.Row="1" Grid.Column="2">F</Button>

    <Button Grid.Row="2" Grid.Column="1">H</Button>

    <Button Grid.Row="2" Grid.Column="2">I</Button>

</Grid>

Đặc điểm

- Các items sẽ phải chỉ ra nó đặt trong cell nào của Grid

- Các item được đặt vừa trong cell

- Có thể sử dụng nhiều hàng, hoặc cột để chứa nội dung. (Sử dụng RowSpan, ColumnSpan)

WrapPanel: Sắp xếp các items theo Line cho đến khi gặp Border (Không đủ khoảng trống để chứa control) sau đó sẽ chuyển sang Line tiếp theo

<WrapPanel Background="Beige">

        <Button>One</Button>

        <Button>Two</Button>

        <Button>Three</Button>

        <Button>Four</Button>

        <Button>Five</Button>

        <Button>Six</Button>

        <Button>Seven</Button>

        <Button>Eight</Button>

</WrapPanel>

Đặc điểm:

- Tự động sắp xếp các item sao cho phù hợp với nội dụng (độ dài và rộng) của nó

DockPanel: Sắp xếp các controls theo 5 vị trí tương ứng: đỉnh (top), đáy (bottom), trái (left), phải (right) và trung tâm (center)

<DockPanel>

        <Button DockPanel.Dock="Top">Top</Button>

        <Button DockPanel.Dock="Bottom">Bottom</Button>

        <Button DockPanel.Dock="Left">Left</Button>

        <Button DockPanel.Dock="Right">Right</Button>

        <Button>Fill</Button>

</DockPanel>

Đặc điểm:

- Các items cần phải xác định đặt trong DockPanel nào.

- Có thể đặt nhiều control trong một vùng

- Item tự động fit phù hợp với content của nó

Canvas: Sắp xếp các item giựa theo vị trí (position) và kích cỡ (size) của nó.

<Canvas Background="Yellow" Width="150" Height="100">

        <TextBlock Canvas.Left="10" Canvas.Top="20">Hello</TextBlock>

        <TextBlock Canvas.Right="10" Canvas.Bottom="20">world!</TextBlock>

</Canvas>

Đặc điểm:

- Không tự động sắp xếp lại control khi size của Canvas thay đổi.

UniformGrid: Sắp xếp các item trong một lưới với cùng số hàng và số cột giống nhau về kích thước

<UniformGrid TextBlock.TextAlignment="Center">

        <TextBlock Text="X" />

        <TextBlock Text="O"/>

        <TextBlock Text="X"/>

        <TextBlock Text="X"/>

        <TextBlock Text="X"/>

        <TextBlock Text="O"/>

        <TextBlock Text="O"/>

        <TextBlock Text="O"/>

        <TextBlock Text="X"/>

</UniformGrid>

Đặc điểm:

- số cell được tự động xác định thông qua số item

Chủ Nhật, 12 tháng 7, 2009

WPF: ứng dụng XAML cho Browser (XBAPs)

Chúng ta biết rằng WWF là framework thống nhất cho việc xây dựng các ứng dụng Workflow, WCF là framework thống nhất cho việc xây dựng các ứng dụng phân tán, truyền thông. Còn đối với WPF, đó làm một framework thống nhất cho việc xây dựng các ứng dụng giao diện Windows. WPF kết hợp các tính năng và công nghệ hiện có trong Windows cũng như Web. Như các bạn thấy, việc thiết kế giao diện Windows form không giới hạn trong sử dụng managed code như C# hay VB trước đây, chúng ta có thể sử dụng XML như HTML trong Web để xây dựng giao diện cho một ứng dụng Window desktop. Ngoài ra WPF cung cấp khả năng xây dụng ứng dụng Web thông qua các page trong một XML Browser Application (XBAP).

1. Tạo một một WPF Browser Application project sử dụng VS 2008

2. Thêm mới 1 Page vào Project

3. Write code Page1.xaml

<Page x:Class="WpfBrowserApplication.Page1"

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

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

    Title="Page1">

    <Grid>

        <TextBlock Name="textBlock1" VerticalAlignment="Top" Height="15.96" Margin="12,31,47,0">

           Click On <Hyperlink NavigateUri="Page2.xaml">Page 2</Hyperlink>

        </TextBlock>

    </Grid>

</Page>

4. Write code Page2.xaml

<Page x:Class="WpfBrowserApplication.Page2"

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

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

    Title="Page2">

    <TextBlock Height="21" Name="textBlock1" Width="120" Text="Page 2" />

</Page>

5. Test

WPF: XAML (P3)

Trong các ví dụ trước, tôi đã trình bày cho các bạn thấy, các thành phần cốt lõi để phát triển một ứng dụng WPF, cách xây dựng một WPF Application, và sử dụng đối tượng Window trong WPF Application. Tuy nhiên dễ dàng nhận thấy rằng, đoạn code trên đã hòa trộn 2 phần rất khác biệt của một ứng dụng vào nhau, đó là phần thể hiện giao diện “Presentation”,trong khai báo các controls và thuộc tính và phần tác nghiệp “Behavior”, trong event. Điều đó làm cho việc thiết kế giao diện trở nên khó khăn. Hơn nữa sẽ khó để phân tách giữa việc thiết kế giao diện và xây dựng nghiệp vụ.

Phần này, tôi giới thiệu các sử dụng XAML trong WPF để thay thế ứng dụng mà tôi đã viết trong các bài trước, bằng việc phân tách giữa thiết kế giao diện và thực thi các events.

XAML (Extensible Application Markup Language) là một ngôn ngữ dựa trên XML được dùng cho việc tạo và khởi tạo các đối tượng .NET. Nó được sử dụng trong WPF như là một thành phần để mô tả giao diện UI cho ứng dụng.

Dưới đây là các bước để thay thế ứng dụng WPF trước đó sử dụng XAML

1. Tạo mới một VS 2008 project sử dụng WPF Application template

2. Thiết kế Window và Button trong XAML (Window1.xaml)

<Window x:Class="MyFirstXAMLWpfApp.Window1"

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

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

    Title="Hello Windows Presentation Foundation!">

    <Button

        x:Name="button"

        Click="button_Click">Submit</Button>

</Window>

3. Viết code cho Event trong .cs file

public partial class Window1 : Window

       public Window1()

           InitializeComponent();

       private void btnSubmit_Click(object sender, RoutedEventArgs e)

           MessageBox.Show("Bạn vừa click vào Submit button!");

5. Bấm F5 để test. Các bạn sẽ thấy kết quả thể hiện không khác ví dụ trước.

Tuy nhiên chúng ta sẽ thay đổi chút ít trong App.xaml để so sánh với đoạn code trong ví dụ trước

6. Xóa StartupUri="Window1.xaml" và thay vào đó là Startup="app_Startup":

<Application x:Class="MyFirstXAMLWpfApp.App"

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

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

    Startup="app_Startup">

    <Application.Resources>

    </Application.Resources>

</Application>

7. Viết code cho app_Startup trong App.xaml.cs

public partial class App : Application

       void app_Startup(object sender, StartupEventArgs e)

           Window window = new Window1();

           window.Show();

8. Bấm F5 để chạy

Chúng ta có thể dễ dàng để so sánh 2 WPF Project sử dụng Code và Markup

WPF: Ứng dụng nho nhỏ (P2)

Trong ví dụ trước WPF HelloWorld thể hiện các thành phần cốt lõi của một ứng dụng WPF. Đó là một ví dụ hết sức đơn giản. Trong thực tế thì một ứng dụng WPF phức tạp hơn rất nhiều. Khi đó các ứng dụng WPF cần phải có một instance của Application class từ System.Windows. Chúng ta thay đổi doạn code trong ví dụ trước như sau:

1. Kế thừa lớp Application

2. Khai báo và Implement StartUp event cho Application

3. Code như sau;

namespace MyFirstWpfApp

    class MyWPFApp: Application

        [STAThread]

        static void Main(string[] args)

            MyWPFApp app = new MyWPFApp();

            app.Startup += new StartupEventHandler(app_Startup);

            app.Run();

        static void app_Startup(object sender, StartupEventArgs e)

            Window window = new Window();

            window.Title = "Hello Windows Presentation Foundation!";

            window.Show();

4. Bấm F5 để Test

Mặc dù chúng ta có thể khai báo và khởi tạo đối tượng Window ngay trong Application. Tuy nhiên, do Window là một đối tượng phức tạo, nó có thể chứa các controls như Button, Label,… hander các Events…Do đó thông thường chúng ta sẽ đóng gói đối tượng Window này bằng một Class. Chúng ta thay đối như sau:

1. Tạo mới một class Window1.cs

2. Kế thừa lớp Window cho lớp này

3. Write code cho class này

namespace MyFirstWpfApp

    class Window1: Window

        public Window1()

            this.Title = "Hello Windows Presentation Foundation!";

            //Khai báo và sử dụng Button

            Button btnSubmit = new Button();

            btnSubmit.Content = "Submit";

            btnSubmit.Click += new RoutedEventHandler(btnSubmit_Click);

            //Add Button vào Window

            this.Content = btnSubmit;

        void btnSubmit_Click(object sender, RoutedEventArgs e)

            MessageBox.Show("Bạn vừa click vào Submit button!");

4. Thay đổi StartUp event trong MyWPFApp.cs như sau:

static void app_Startup(object sender, StartupEventArgs e)

            //Window window = new Window();

            //window.Title = "Hello Windows Presentation Foundation!";

            //window.Show();

            Window1 window = new Window1();

            window.Show();

5. Bấm F5 để test

WPF: Hello (P1)

WPF (Windows Presentation Foundation) là một framework hoàn thiện cho việc lập trình giao diện Windows. Thư viện cốt lõi của WPF bao gồm

WindowsBase.dll

PresentationCore.dll

PresentationFramework.dll

Dưới đây là một ví dụ WPF cực kỳ đơn giản:

1. Các bạn tạo mới một Console Application sử dụng VS 2008

2. Add reference tới các dll ở trên

3. Khai báo using System.Windows; //đây là namespace gốc của WPF

4. Write code:

using System;

using System.Windows;

namespace MyFirstWpfApp

    class Program

        [STAThread]

        static void Main(string[] args)

            MessageBox.Show("Hello Windows Presentation Foundation!");

5. Bấm F5 để Test. Bạn sẽ thấy

Thứ Sáu, 3 tháng 7, 2009

Custom Current User Field

In MOSS 2007 and WSS 3, we have “People and Group” field to specify User or Group. Some time we need to set default value for this. But It’s not default function of “People and Group”. You must create one custom field using Visual Studio 2008 Extensions for WSS 3 and Custom Field template. The code is very easy to write and understand:

public class CurrentUserFieldField : SPFieldUser

        public CurrentUserFieldField(SPFieldCollection fields, string fieldName)

            : base(fields, fieldName)

        public CurrentUserFieldField(SPFieldCollection fields, string typeName, string displayName)

            : base(fields, typeName, displayName)

        public override string DefaultValue

get

                SPWeb web = SPContext.Current.Web;

                SPUser currentUser = web.CurrentUser;

                return string.Format("{0};#{1}", currentUser.ID.ToString(), currentUser.Name);

set

                base.DefaultValue = value;