Rabu, 05 Oktober 2011

aplikasi dengan WPF


"Sekilas WPF"

Dalam NET Framework. 4, rehosting desainer dan skenario aktivitas kustom desainer telah sangat disederhanakan untuk memungkinkan Anda lebih fleksibel dalam penyebaran serta pengembangan lebih mudah karena aktivitas desainer model pemrograman yang dibangun di atas Windows Presentation Foundation (WPF). Ini memberikan Anda kemampuan untuk membuat definisi deklaratif desainer aktivitas serta mudah rehost desainer alur kerja di lain aplikasi front-end
.
Pada sesi ini memperkenalkan  model pemrograman desainer dari Windows Workflow 4. Yang akan mengulas seadikit tentang bagaimana me-rehost desainer alur kerja dalam aplikasi desktop WPF dan menyesuaikannya dalam beberapa cara. cangkupannya antara lain menambahkan toolbox, sebuah tool property atau penampil kode XAML.

Selain itu, akan diulas bagaimana untuk membuat desainer  komposit untuk kegiatan alur kerja Anda. Hal ini akan melibatkan tidak hanya menciptakan desainer untuk kegiatan costume didefinisikan dalam kode, tetapi juga menimpa desainer standar kegiatan built-in kegiatan.
 

work ::::::

  1. Pendesain Rehosting
  2. Membuat Designer Custom untuk sebuah Activity
  3. Menambahkan Kontrol ke Designer Kegiatan
  4. Membangun Composit Activity Desaigner

Latihan 1 Rehosting Desaigner::::::::::::::::

latihan ini menguak langkah demi langkah membuat Workflow Designer in a WPF application menggunakan Visual Studio 2010 dan sebuah langkah awal pre-built activity provided  (Prompt Activity).
hasil akhirnya berupa aplikasi WPF  yang dijalankan pada hosting menggunakan  Workflow Designer.


Gambar 1. Workflow Designer Hosting dalam bentuk WPF
Latihan ini memperlihatkan fitur alur kerja desainer berikut:



Task 1 – Membuat  Windows Presentation Foundation Application
buat WPF kosong WPF application menggunakan  WPF Application Visual Studio template, dan tambahkan  CustomActivities project .
  1. Buka Microsoft Visual Studio 2010 dari Start | All Programs | Microsoft Visual Studio 2010 |Microsoft Visual Studio 2010.
  2. Create a new project in Visual Studio 2010 pilih tipe WPF Application. create New on the File menu, and then click Project. Click Windows Visual Basic Installed Templates list. didalam Templates pane, click WPF Application, dan pastikan configurasi .NET Framework 4.0. Set nama project dengan hosting1,  solution’s name : Begin, set lokasi yang diinginkan, and then click OK.



  1. Merubah pengaturan framework of the HostingApplication project ke .NET Framework 4. To do this in Solution Explorer, click-kanan the HostingApplication project and select Properties.
  • Untuk proyek Visual Basic, pilih tab Kompilasi dan klik tombol Advanced Options Kompilasi. Pada kotak dialog Pengaturan Lanjutan pilih Compiler Framework pilihan. 4 NET daftar Kerangka Sasaran dropdown dan klik OK.
 
catatan "pastikan project telah tersimpan "klik save all pada toolbar dan simpan diderectory yang telah dibuat"




Click Yes di menu Target Framework Change message box untuk konfirmasi merubah target framework.
Catatan: Secara default Aplikasi WPF proyek template yang dikirimkan dengan Visual Studio 2010 menciptakan sebuah proyek yang menargetkan Framework Klien Profil NET 4.. Profil Klien menyembunyikan beberapa majelis yang diperlukan untuk rehost desainer. Itulah mengapa harus diubah untuk menggunakan penuh. NET Framework 4.

  • Add a project dengan Prompt custom activity. Untuk melakukan hal ini, pada Solution Explorer click-kanan Begin solution, point to Add and select Existing Project. In the Add Existing Project dialog box CustomActivities.vbproj (Visual Basic). Click Open untuk menambahkan project.
  • Menambahkan referensi ke proyek CustomActivities. Untuk melakukan hal ini di Solution Explorer, klik kanan proyek HostingApplication dan pilih Tambah Referensi. Dalam dialog Referensi Tambah, beralih ke tab Proyek dan pilih proyek CustomActivities. Klik OK untuk menambahkan referensi
  •  Tambahkan referensi ke majelis Workflow. Untuk melakukan hal ini, di Solution Explorer klik kanan proyek HostingApplication dan pilih Tambah Referensi. Pada kotak dialog Referensi Tambah, beralih ke tab NET dan pilih.:
    ◦ System.Activities
    ◦ System.Activities.Core.Presentation
    ◦ System.Activities.Presentation
    Klik OK untuk menambahkan referensi.

Hosting Workflow Designer:::::::::::::::::::::::::
 
Dalam sesi ini  akan mengkonfigurasi Grid WPF yang akan berisi Workflow Designer. Kemudian, Anda akan menciptakan contoh WorkflowDesigner pemrograman, dan menambahkan kegiatan urutan dengan dukungan desainer .
  • Buka file MainWindow.xaml dalam mode desain. Untuk melakukan ini, klik dua kali file MainWindow.xaml.

  • Sesuaikan ukuran jendela. Untuk melakukan ini, pilih MainWindow.xaml pada designer, tekan F4 untuk menampilkan jendela Properties dan di bagian Tata Letak Lebar diatur ke nilai 800 dan Tinggi ke nilai 600.

     

  • Menetapkan nama Grid. Untuk melakukan ini, pilih panel Grid pada designer, dan mengatur properti Nama untuk grid1.
  • Mengatur tata letak jendela menggunakan panel Grid. Untuk melakukan hal ini, pada jendela Properties klik elipsis di sebelah properti ColumnDefinitions untuk membuka Editor Koleksi.

  • Tambahkan tiga kolom ke tata letak grid, dan mengatur lebar mereka. Dalam Editor Koleksi, gunakan tombol Add untuk memasukkan tiga kolom dalam tata letak. Mengatur properti Lebar kolom tengah ke 4 nilai *. Klik OK untuk menambahkan kolom dan tutup editor menyimpan perubahan.

  Kode XAML yang dihasilkan ditampilkan di bawah.
XAML
<Grid Name="grid1">
     <Grid.ColumnDefinitions>
         <ColumnDefinition />
         <ColumnDefinition Width="4*" />
         <ColumnDefinition />
     </ Grid.ColumnDefinitions>
</ Grid>

  • Menulis kode untuk tuan rumah Workflow Designer pemrograman. Untuk melakukan hal ini, di Solution Explorer klik kanan file dan pilih Kode MainWindow.xaml Lihat. Memodifikasi kode dengan mengikuti langkah-langkah:  
(Untuk pengguna Visual Basic hanya) Tambah memanggil konstruktor kelas inisialisasi jendela. Untuk melakukan hal ini, tambahkan prosedur Baru berikut Sub ke kelas MainWindow.


Visual Basic
Public Sub New()
    InitializeComponent()
End Sub

 Menyatakan bidang anggota pribadi untuk memegang sebuah instance dari WorkflowDesigner. Untuk melakukan hal ini, tambahkan kode berikut (ditampilkan dalam huruf tebal) ke kelas Window1.

Visual Basic
Class MainWindow
    Private WithEvents wd As WorkflowDesigner

    Public Sub New()
        InitializeComponent()
    End Sub
End Class

 Membuat sebuah instance dari WorkflowDesigner, tambahkan aktivitas urutan untuk itu, dan menempatkannya di tengah kolom dari grid WPF. Untuk melakukan hal ini, tambahkan metode berikut untuk kelas AddDesigner MainWindow.

(Code Snippet - WF Designer Programming Model Lab - AddDesigner Method VB)
Visual Basic
Private Sub AddDesigner()
    'Create an instance of WorkflowDesigner class
    Me.wd = New WorkflowDesigner()

    'Place the WorkflowDesigner in the middle column of the grid
    Grid.SetColumn(Me.wd.View, 1)

    'Load a new Sequence as default.
    Me.wd.Load(New Sequence())

    'Add the WorkflowDesigner to the grid
    grid1.Children.Add(Me.wd.View)
End Sub
  • Tambahkan dukungan desainer untuk kelas urutan dengan memanggil metode daftar kelas DesignerMetadata. Ini akan memungkinkan Anda untuk drop kegiatan di dalam aktivitas urutan. Untuk melakukan hal ini, tambahkan metode berikut untuk kelas privat MainWindow.

Visual Basic
Private Sub RegisterMetadata()
    Dim dm as New DesignerMetadata()
    dm.Register()
End Sub

  • Pada konstruktor kelas MainWindow, tambahkan panggilan (ditampilkan dalam huruf tebal) dengan metode dinyatakan sebelumnya untuk mendaftar metadata untuk dukungan desainer dan menciptakan WorkflowDesigner.
Visual Basic
Public Sub New()
    InitializeComponent()
    Me.RegisterMetadata()
    Me.AddDesigner()
End Sub
  • Mengatur proyek HostingApplication sebagai proyek startup. Untuk melakukan ini, klik kanan proyek HostingApplication di Solution Explorer dan pilih Tetapkan sebagai Project StartUp.

  • Tekan CTRL + F5 untuk membangun dan menjalankan solusi dan memverifikasi bahwa Workflow Designer host di jendela aplikasi.

    Menciptakan Toolbox dan Properti Inspektur Windows::::::::::::::::::::::::::::

    Dalam tugas ini Anda akan membuat Toolbox dan Properti Inspektur jendela, dan menambahkan mereka ke Workflow Designer

  • Buat Toolbox dan termasuk dalam grid WPF. Untuk melakukan hal ini, di Solution Explorer klik kanan file dan pilih Kode MainWindow.xaml Lihat. Memodifikasi kode dengan mengikuti langkah-langkah:
  • Tambahkan sebuah metode pabrik bernama GetToolboxControl yang menciptakan ToolboxControl, menambahkan Kategori Koleksi Barang Toolbox bernama category1 di dalamnya, dan memberikan dua item itu:
  1. • CustomActivities.Prompt aktivitas.
  2. • System.Activities.Statements.Sequence aktivitas. 
(Code Snippet - WF Designer Programming Model Lab - GetToolboxControl Method VB)
Visual Basic
Private Function GetToolboxControl() As ToolboxControl
    ' Create the ToolBoxControl
    Dim ctrl As New ToolboxControl()

    ' Create a collection of categories
    Dim categoryItems As New ToolboxCategory("category1")
    
    ' Creating toolboxItems
    Dim tool As New ToolboxItemWrapper("CustomActivities.Prompt", "CustomActivities", Nothing, Nothing)

    Dim tool2 As New ToolboxItemWrapper("System.Activities.Statements.Sequence", "System.Activities, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35", Nothing, "Sequence")

    'Adding the toolboxItems to the category.
    categoryItems.Add(tool)
    categoryItems.Add(tool2)

    'Adding the category to the ToolBox control.
    ctrl.Categories.Add(categoryItems)
    Return ctrl
End Function
 
  • Tempatkan kontrol Toolbox untuk kolom paling kiri dari grid WPF. Untuk melakukan hal ini, menambahkan AddToolbox metode pribadi ke kelas Window1.
  • (Code Snippet - WF Designer Programming Model Lab - AddToolBox Method VB)
    Visual Basic
    Private Sub AddToolBox()
        Dim tc As ToolboxControl = GetToolboxControl()
        Grid.SetColumn(tc, 0)
        grid1.Children.Add(tc)
    End Sub
    • Tambahkan panggilan ke metode AddToolbox dibuat pada langkah sebelumnya. Untuk melakukan hal ini, tambahkan kode berikut (ditampilkan dalam huruf tebal) ke konstruktor kelas MainWindow. 
     
    Visual Basic
    Public Sub New()
        InitializeComponent()
        Me.RegisterMetadata()
        Me.AddDesigner()

        Me.AddToolBox()
    End Sub
    • Tekan CTRL + F5 untuk membangun dan menjalankan solusi dan memverifikasi bahwa toolbox dibuat dalam kolom paling kiri dari jendela aplikasi dan bahwa item diseret dari toolbox dapat dijatuhkan pada permukaan Workflow Designer.

     
    • Sekarang Anda akan membuat jendela Property Inspector dan memasukkannya dalam grid WPF. Untuk melakukan hal ini, di Solution Explorer klik kanan file MainWindow.xaml, pilih View Code. Memodifikasi kode dengan mengikuti langkah-langkah: 
    • Tempatkan jendela PropertyInspector ke kolom paling kanan dari grid WPF. Untuk melakukan hal ini, menambahkan metode AddPropertyInspector swasta untuk kelas MainWindow.
        • (Code Snippet - WF Designer Programming Model Lab - AddPropertyInspector Method VB) 
        • Visual Basic
        Private Sub AddPropertyInspector()
            Grid.SetColumn(wd.PropertyInspectorView, 2)
            grid1.Children.Add(wd.PropertyInspectorView)
        End Sub
         
    • Tambahkan panggilan ke metode AddPropertyInspector dibuat pada langkah sebelumnya. Untuk melakukan hal ini, tambahkan kode berikut (ditampilkan dalam huruf tebal) ke konstruktor kelas MainWindow.
     
    Visual Basic
    Public Sub New()
        InitializeComponent()
        Me.RegisterMetadata()
        Me.AddDesigner()
        Me.AddToolBox()

        Me.AddPropertyInspector()
    End Sub

    Tekan CTRL + F5 untuk membangun dan menjalankan solusi dan memverifikasi bahwa jendela PropertyInspector dibuat dalam kolom paling kanan dari grid.
 
 
 
Verification::::::::::::::::::::::
Dalam rangka untuk memverifikasi bahwa Anda telah benar melakukan setiap langkah dari latihan ini, Anda akan mengeksekusi proyek HostingApplication dan menggunakan desainer.
  • Mengatur proyek HostingApplication sebagai proyek startup. Untuk melakukan ini, klik kanan proyek HostingApplication di Solution Explorer dan pilih Tetapkan sebagai Project StartUp.
  • Tekan CTRL + F5 untuk menjalankan aplikasi.
  • Bermain-main dengan desainer, menyeret dan menjatuhkan item dari Toolbox ke Urutan kegiatan.
  • Select an activity in the designer and notice how the Property Inspector window display different information according to the activity you have selected.
  • Finally, close the window to end this verification.
 
Diposting oleh di Tidak ada komentar:
Langganan: Komentar (Atom)