Reyza

MVPs, MUGI and MIC ITB at MSDN Day Special Edition

reyza — Sun, 30 Nov 2008 12:04:00 GMT

All Indonesian MVP came to MSDN Day Special Edition that we (Microsoft Indonesia, Microsoft Indonesia User Group - MUGI and MIC ITB) created in Bandung. This is the biggest MSDN Day in this year, almost 1000 developers & IT Pros came to this event.

{Jonah Stephen talked about PDC and what new in Microsoft Technology}

All of MVPs talked in this event. We introduced many of Microsoft Technology in here, such as :

Green Computing & Virtualization: An Enterprise Point of View.
Windows Presentation Foundation.
Hyper-V & SCVMM 2008.
Silverlight 2.0.
VSTS & TFS 2010: A First Look.
Parallel Programming and Multicore System.
Internet Explorer 8 for Developers.
XNA Games Studio and XBOX Development.
Windows Azure: An Overview.
Windows Vista Deployment.
Microsoft Virtualization 360 degrees – from Desktop to Datacenters.
High Performance Computing 2008.
SQL Server 2008 Overview.
Office Communication Server 2007 R2 Preview.

How about me? I and Rully Yulian delivered about Silverlight 2.0 : Jazz up your Web Application with Silverlight 2.0.

{I and Rully, talk about using Silverlight 2.0 to build RIA and LOB Application}

{MVPs and MUGI family}

{MVP Gathering at The Palm}

Lilian and Canny, where are you? I can see one of you at those pictures. You should here with us :(

Share this post: | | | |

Community Server 2008 Developer's Guide

reyza — Sun, 02 Nov 2008 03:58:29 GMT

Community Server ? Tetep...

Bagi yang ingin bermain dengan Community Server 2008 sebagai developer, untuk membuat theme, membuat modul atau yang lainnya maka dapat men-download tulisan sebanyak 220 halaman ini disini.

Ebook ini membahas 6 topik utama yaitu :

{General Topic}

Configuring Community Server for Amazon S3
Allowing the User to Upload Files Greater than 4Mbytes
Changing the Email Address of Emails Originating from Community Server
Preventing Community Server from Removing www from a URL
Configuring w.bloggar to Work with Community Server
Using Content Editors
Setting Spam Controls
Customizing Footers
Displaying Edit Notes to All Users
Editing the Ban Reason and Ban Time Period Options
Enabling Exception Logs
Hiding Tag Clouds
Installing Multiple Instances of Windows Service
Uninstalling Multiple Instances of Windows Server
Migrating Users into a Group
Migrating Forums into a Group
Rebuilding Indexes
Setting Enhanced Editor as Default
Setting Up a Virtualized Community Server Instance
Troubleshooting Enterprise Indexing
Touching the web.config File

{Advaned Themes}

Adding a Content Part to a New Page
Copying a Theme
Creating New Themes
Customizing the Look of a Theme Page Based on Its Context
Displaying the Author’s Avatar Next to a Post
Adding Dynamic Configuration Options
Extending User Registration with Sub-Forms
Finding the QueryOverride Options for List Control
Formatting Dates with Community Server 2.1 in Today/Yesterday Format
Rendering the First Item in a List Differently
Rendering Polls Outside of Forums
Adding New Pages to Themes
Using a Solid Background Color for Sidebars

{Customization}

Configuring Community Server for a Single-User Blog.
Stopping Truncating Posts on Aggregate Body Pages Extensibility

{Chameleon}

Common Code Examples
CSModule Overview
CSModule Events
Writing and Configuring a CSModule
Tasks

{Shared Membership}

Introduction to Chameleon
Chameleon Control Documentation
Action Controls ASP.net Master Pages with Chameleon
Condition Controls
Form Controls
Implicit Databinding
Utility Controls
List Controls
Pager Controls
Single Value Controls
Sub-Form Controls
Using User Controls with Chameleon
Writing Blog Posts Outside of the Control Panel
Windows LIveWriter Updates
Publishing to Your Blog Offline
Blog Control Property Data
Core Control Property Data
File Gallery Control Property Data
Forum Control Property Data
Chameleon Base Classes

{Yang Menarik}

Community Server 2008 ternyata bisa bekerja sama dengan Amazon Simple Storage Server (S3), ini baru saya tahu dan menarik. Dengan begitu artinya kita dapat mengurangi beban server kita untukmenyimpan file attachment yang sering kita masukkan pada posting blog, forum dan lain-lain. Selain itu Amazon S3 dapat dimafaatkan CS2008 untuk menyimpan avatar dari setiap user. Manfaatnya, nanti saat ada kebutuhan kita untuk mem-backup CS tidak perlu pusing dengan ukuran file yang besar akibat file gambar dan attachment lainnya.

Selamat mencoba dan selamat belajar, semoga bermanfaat.

NB : Kalau sudah belajar, sudah mahir silakan drop email anda ke mic[at]x-team.com.

Share this post: | | | |

MS Chart Control or Dundas Chart Control ?

reyza — Tue, 28 Oct 2008 14:54:34 GMT

Sebelumnya ucapan terima kasih dulu untuk Denni Gautama yang telah memberikan informasin via milis tentang keberadaan MS Chart ini. Dan akhirnya didownload lah keempat file ini :

Memang belum banyak yang saya tahu dari MS Chart Control ini, cuma tangan gatel pengen ngeblog gara-gara tampilan dari sample yang ada pada Websamples.zip.

Tampilannya web di atas sangat mirip Dundas begitu juga corak warna dan bentuk dari chart yang dihasilkan. Mantabs nih. Ada apakah antara MS Chart Control dan Dundas ?

Banyak feature yang bisa didapatkan pada MS Chart ini seperti yg dapat dilihat pada gambar menu berikut ini.

Dan mata tiba-tiba tertarik untuk membuat menu Interactivity and AJAX.

MS Chart dipastikan sangat berteman dengan ASP.NET Ajax, artinya tentu juga berteman dengan UpdatePanel dan lain-lain. Pada bagian Interactivity and AJAX ini dapat didapatkan feature-feature seperti berikut ini :

Dengan mengarahkan ke objek pada chart maka dapat dilihat tooltip yang keluar. Disini kita diberi kebebasan untuk mengeluarkan data yang diinginkan pada tooltips, seperti yang dilihat pada gambar sebelah kiri.

Pada gambar sebelah kanan lebih menarik lagi. Bila salah satu bagian pie pada gambar diklik makan akan ditampilkan penggalan bagian yang kita pilih terpisah dari chart.

Hal lain ang menarik adalah pada contoh Clieck Event and AJAX UpdatePanel yang hasilnya dapat dilihat pada gambar di bawah ini.

Kita dapat mengklik salah satu data pada chart maka dapat dilihat form untuk mengupdate data tersebut. Menarik.

Hal lain yang diberikan oleh MS Chart Control adalah Real Time Chart, untuk membuat hal ini terjadi kita dapat menggabungkan MS Chart Control, UpdatePanel dan control timer yang ada pada ASP.NET Ajax.

Hasilnya tentu saja pergerakan data pada chart akan berubah secara "real-time".

Lain kali akan disambung lagi dengan bahasan bagaimana menggunakan MS Chart Control.

Selamat mencoba.

Share this post: | | | |

The Heart Race Test with The Top 20 Grid Girls & Silverlight

reyza — Sat, 18 Oct 2008 15:40:51 GMT

Bagi pria-pria normal, atau pria-pria yang kuliah di Fisika dan mendalami gerak Brown dan sering melakukan pengamatan banyak partikel, maka berikut ini ada 20 partikel yang dapat diamati. Partikel yang dibungkus dalam kulit "Grid Girls".

"Grid Girls" ini pertama kali saya lihat saat ada Workshop Silverlight 2.0 untuk para designer Kompas, diperlihatkan saat opening workshop oleh salah seorang personel DPE yang pasti dikenal banyak orang (demi kenyamanan bersama, identitasnya dirahasiakan ... hehehe).

Penampilkan 20 Grid Girls ini dapat dilihat di sini. Pastikan sebelum melihatnya Silverlight runtime sudah terinstall pada komputer anda.

Pada halaman ini nantinya kita akan dapat melihat ekspresi ke 20 Grid Girl agar kita mau mengarahkan cursor mouse ke salah satu dari mereka. Dan ketika cursor mouse telah menunjuk ke salah satu Grid Girl tersebut dapat kita lihat ekspresi senang dan gembira, dan juga dapat dilihat ekspresi kesal dan sedih dari ke-19 Grid Girl yang tidak terpilih.

Menarik idenya, dan sangat mudah membuatnya dengan Silverlight 2.0. Yang mesti disiapkan adalah setiap Grid Girl mempunyai 3 video, yaitu :

video dengan ekspresi normal.
video dengan ekspresi senang ketika cursor mouse berada pada area.
video dengan ekspresi sedih dan kesal ketika melihat Grid Girl yang lain telah dipilih.

Ini adalah ekpresi normal setiap Grid Girls.

Dan pada gamber berikut dapat dilihat ekspresi salah seorang Grid Girl yang terpilih dan ekpresi Grid Girl lainnya yang tidak terpilih.

Pengetahuan Silverlight apa yang harus kita ketahui untuk membuat hal seperti ini ? Berikut hal-hal yang mesti kita ketahui :

Layout controls pada Silverlight.
MediaElement control.
Event.

{Layout Controls}

Pada Silverlight 2.0 terdapat control-control yang dapat digunakan untuk mengatur tata letak, yaitu :

Grid.
Canvas.
StackPanel.

Secara default ketika Project Silverlight Application dibuat baik dengan Expression Blend 2 atau Visual Studio 2008 dapat dilihat pada file Page.xaml menggunakan control Grid sebagai layout.

Grid

Dengan menggunakan Grid kita dapat membuat dua tipe layout, yaitu layout dengan

Ada dua mode yang dapat digunakan bila menggunakan Grid sebagai bantuan layout yaitu secara absolut atau dengan menggunakan template. Mengaturan tata letak suatu control dalam Grid secara abosolut dapat dilihat seperti contoh berikut :

<Grid x:Name="LayoutRoot" Background="White">
    <TextBlock Text="Absolute Grid Layout" 
               Margin="23,23" 
               HorizontalAlignment="Left" 
               VerticalAlignment="Top"/>
</Grid>

Pertama yang harus dilakukan adalah menentukan titik pusat 0,0 dengan menambahkan atribut HorizontalAlignment & VerticalAlignment. Setelah itu pada atribut Margin dapat dituliskan titik yang diinginkan dari titik pusat.

Sedangkan berikut ini adalah contoh penggunaan template layout pada Grid.

<Grid x:Name="LayoutRoot" Background="White">
    <Grid.RowDefinitions>
        <RowDefinition Height="23"/>
        <RowDefinition Height="23"/>
        <RowDefinition Height="23"/>
    </Grid.RowDefinitions>
    
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="132"/>
        <ColumnDefinition Width="132"/>
        <ColumnDefinition Width="132"/>
    </Grid.ColumnDefinitions>
    
    <TextBlock Text="0,0" Grid.Column="0" Grid.Row="0"/>
    <TextBlock Text="1,1" Grid.Column="1" Grid.Row="1"/>
    <TextBlock Text="2,2" Grid.Column="2" Grid.Row="2"/>
</Grid>

Pada contoh di atas terlebih dahulu dibuat template layout dengan menggunakan RowDefinition "atau" ColumnDefinition. Kenapa menggunakan "atau" karena dapat digunakan hanya RowDefinition saja, atau ColumnDefinition saja atau keduanya. Pada contoh di atas template layout berbentuk table 3x3. Setelah template layout dibuat, maka tinggal ditentukan suatu control akan menempati kolom dan baris berapa seperti yang bisa dilihat pada contoh berikut ini.

<TextBlock Text="0,0" Grid.Column="0" Grid.Row="0"/>

Pada contoh di atas, pada control dapat dilihat terdapat atribut Grid.Column dan Grid.Row untuk menentukan letak control tersebut pada template layout yang telah dibuat.

Control layout yang yang lain adalah Canvas. Control ini sering digunakan saat masih bekerja pada Silverlight 1.0. Pada Canvas pengaturan control dilakukan secara absolut. Berikut contohnya :

<Canvas Background="White">
    <TextBlock Text="Control in Canvas" 
               Canvas.Left="13" 
               Canvas.Top="13"/>
</Canvas>

Pada contoh di atas dapat dilihat, untuk menentukan koordinat suatu control pada Canvas dapat dilakun dengan menggunakan atribut Canvas.Left dan Canvas.Top.

Canvas juga dapat digunakan untuk mengelompokkan beberapa control dan mengatur posisinya seperti pada contoh di bawah ini.

<Canvas Background="Black">
    <Canvas Background="Gray" Height="200" Width="200" 
            Canvas.Top="5" Canvas.Left="5">
        <TextBlock Text="Nama :" 
                   Canvas.Left="13" 
                   Canvas.Top="13">
         </TextBlock>
        <TextBox Width="113" 
                 Canvas.Left="55" 
                 Canvas.Top="10"/>
    </Canvas>
    
    <Canvas Background="Red" 
            Height="100" 
            Width="100" 
            Canvas.Left="213" 
            Canvas.Top="5">
        <Button Content="Submit" 
                Width="75" 
                Canvas.Left="3" 
                Canvas.Top="3"/>
        <Button Content="Reset" 
                Width="75" 
                Canvas.Left="3" 
                Canvas.Top="32"/>
    </Canvas>
</Canvas>

Hasilnya bisa dilihat pada gambar berikut ini :

Control layout yang lain yang dapat digunakan adalah StackPanel. StackPanel adalah control layout yang sederhana. Caranya cukup dengan mengumpulkan control-control yang ingin ditampilkan didalamnya maka secara default StackPanel akan mengaturnya secara vertical seperti gambar berikut ini.

Berikut kode yang digunakan :

<StackPanel Background="White">
    <Button Content="Button" Width="100" Height="23"/>
    <Button Content="Button" Width="100" Height="23"/>
    <Button Content="Button" Width="100" Height="23"/>
</StackPanel>

Pada StackPanel mempunyai atribut Orientation yang nilainya adalah Horizontal atau Vertical, yang berfungsi untuk menentukan control-control akan ditampilkan tersusun secara vertikal atau horizontal.

<StackPanel Background="White" Orientation="Horizontal">
    <Button Content="Button" Width="100" Height="23"/>
    <Button Content="Button" Width="100" Height="23"/>
    <Button Content="Button" Width="100" Height="23"/>
</StackPanel>

{MediaElement Control}

Control ini dapat digunakan untuk menampilkan video dan audio. Tetapi jangan harap semua format video dan audio dapat ditampilkan, hanya format yang mempunyai hubungan darah dengan Microsoft saja yang dapat ditampilkan, yaitu WMV, WMA dan MP3.

Berikut contoh penggunaan control MediaElement :

<MediaElement x:Name="MediaElement1" Source="bca.wmv"/>

Atribut Source berisi nama file media yang letaknya berada pada direktori ClientBin.

Selain menuliskan pada file XAML juga dapat dituliskan pada code file dari file XAML. Terlebih dulu control ini kita beri ID dengan menggunakan atribut x:Name seperti pada contoh di atas. Maka kita dapat memberikan nilai pada atribut yang diinginkan secara pemrograman dengan cara berikut :

MediaElement1.Source = new Uri("bca.wmv", UriKind.Relative);

{Event}

Hal terakhir yang perlu diketahui adalah event. Semua control pada SIlverlight mempunya event, termasuk control MediaElement. Beberapa event yang dapat digunakan pada MediaElement, yaitu :

MouseEnter, event ini seperti OnMouseOver kalau di HTML.
MouseLeave, event ini seperti OnMouseOut.

Berikut contoh kode yang ada pada file Page.xaml :

<MediaElement x:Name="MediaElement1" 
              MouseEnter="MediaElement1_MouseEnter" 
              MouseLeave="MediaElement1_MouseLeave" 
              Source="bca.wmv"/>

Dan berikut kode yang ada pada file Page.xaml.cs :

public partial class Page : UserControl
{
    public Page()
    {
        InitializeComponent();
    }

    private void MediaElement1_MouseEnter(object sender, MouseEventArgs e)
    {

    }

    private void MediaElement1_MouseLeave(object sender, MouseEventArgs e)
    {

    }
}

Singkatnya :

Bila pointer mouse berada pada area MediaElement1 (MouseEnter), maka method MediaElement1_MouseEnter akan dipanggil.
Bila pointer mouse keluar dari area MediaElement1 (MouseLeave), maka method MediaElement1_MouseLeave akan dipanggil.

{20 Grid Girls Show with Silverlight}

Nah dari coret2an di atas maka kita dapat membuat sesuatu seperti tayangan 20 Grid Girls di atas, dengan lebih sederhana. Idenya adalah setiap Grid Girl mempunyai 3 video seperti yang telah disebutkan di atas, yaitu :

girl_1_normal.wmv : ekpresi normal Grid Girl #1.
girl_1_terpilih.wmv : ekspresi terpilih Grid Girl #1.
girl_1_sedih.wmv : ekspresi tidak terpilih Grid Girl #1.

Kemudian tulis kode seperti berikut :

<MediaElement x:Name="GridGirl1" 
      MouseEnter="GridGirl1_MouseEnter" 
      MouseLeave="GridGirl1_MouseLeave" 
      Source="girl_1_normal.wmv"/>
<MediaElement x:Name="GridGirl2" 
      MouseEnter="GridGirl2_MouseEnter" 
      MouseLeave="GridGirl2_MouseLeave" 
      Source="girl_2_normal.wmv"/>

Dengan kode di atas, ketika halaman diload pertama kali, akan ditampilkan ekspresi normal dari sang Grid Girl. Selanjutnya adalah sebagian contoh kode pada Page.xaml.cs :

private void GridGirl1_MouseEnter(object sender, MouseEventArgs e)
{
    GridGirl1.Stop();
    GridGirl1.Source = new Uri("girl_1_terpilih.wmv", UriKind.Relative);
    GridGirl1.Play();

    GridGirl2.Stop();
    GridGirl2.Source = new Uri("girl_2_sedih.wmv", UriKind.Relative);
    GridGirl2.Play();
}

private void GridGirl1_MouseLeave(object sender, MouseEventArgs e)
{
    GridGirl1.Stop();
    GridGirl1.Source = new Uri("girl_1_normal.wmv", UriKind.Relative);
    GridGirl1.Play();

    GridGirl2.Stop();
    GridGirl2.Source = new Uri("girl_2_normal.wmv", UriKind.Relative);
    GridGirl2.Play();
}

Hal yang sama juga ditulisa pada method GridGirl2_MouseEnter & GridGirl2_MouseLeave. Ini cuma contoh sederhana makanya masih kurang efisien disana sini dari sisi penulisan kode-nya.

Semoga bermanfaat.

Share this post: | | | |

ASP.NET 3.5 Workshop with Two Big ISVs at Bandung

reyza — Wed, 15 Oct 2008 00:17:38 GMT

Sudah jelas di Bandung banyak ISV yang tentu saja mempunyai aktivitas dalam pembangunan software. Beberapa di antaranya adalah PT Multimedia Solusi Prima dan PT Ebdesk. Kedua ISV tersebut lebih memfokuskan diri kepada teknologi PHP dan C++.

PT Multimedia Solusi Prima mempunyai pengalaman dalam pembangunan software untuk goverment di Indonesia dengan menggunakan teknologi PHP. Sedangkan PT Ebdesk mempunyai produk Ebdesk Portal yang sudah dikenal baik di dalam negeri bahkan di luar negeri, dan sudah diimplementasikan di banyak instansi dan organisasi di beberapa negara tetangga. Produk mereka adalah aplikasi berbasis web yang dibangun dengan C++ dan CGI.

{ASP.NET 3.5 Workshop at PT Multimedia Solusi Prima}

Workshop ini diikuti oleh 5 developer PHP dan dilaksanakan selama 30 Jam.

{ASP.NET 3.5 Workshop at PT Ebdesk}

Workshop ini diikuti oleh 6 developer C++ & CGI dan dilaksanakan selama 4 hari.

{Workshop Outline}

Berikut ini adalah materi yang diajarkan selama workshop :

Visual Studio 2008 Introduction.
C# 3.0.
ADO.NET.
LINQ to SQL.
ASP.NET Standard Controls.
Data binding.
Theme and Skin.
Membership and Role Management.
Navigation.
Validator Controls.
Reporting with Report Viewer.
ASP.NET Ajax & Ajax Control Toolkit.
Web Service.

{Hand on Lab Manual}

HOL yang digunakan selama workshop dapat didownload secara gratis di sini.

Share this post: | | | |

Silverlight 2.0 Workshop with Kompas Designers

reyza — Tue, 14 Oct 2008 07:46:23 GMT

Tanggal 13 Oktober 2008 selama kurang lebih 5 jam, saya harus menurunkan sedikit kerja otak kiri dan menaikkan kerja otak kanan karena saat itu harus bertemu dengan para designer-designer Kompas. Sebelum workshop ini dilaksanakan sudah disiapkan materi sebagai berikut :

Silverlight 2.0 Controls.
Layout.
Media.
Animation.
Data binding.
Networking.
ASP.NET Controls.
Image Deep Zoom.
Page Turn.
Silverlight, PHP & Apache Web Server.

Tapi karena ternyata peserta yang datang adalah para designer maka materi-materi yang mengumbar kemampuan otak kiri harus dipangkas.

Pada workshop ini ada beberapa tool yang digunakan, yaitu :

Microsoft Expression Blend 2.
Microsoft Expression Design 2.
Microsoft Expression Encoder 2.
Deep Zoom Composer.
Visual Studio 2008.

Hasil para peserta dapat dengan mudah menampilkan dan membuat :

Silverlight Media Player.
Deep Zoom Tag Browser.
Page Turn.

What's next ?

Next Event :

31 Oktober - 2 November : Jalan-jalan ke Belitong :)

Share this post: | | | |

Silverlight 2 RC0 : motion path, where are you?

reyza — Sun, 28 Sep 2008 17:52:37 GMT

Kemanakah fasilitas bernama "motion path" adalah pertanyaan yang selalu dicoba dicari jawabannya setiap versi terbaru Silverlight atau Blend keluar.

Sebagai informasi, bersamaan dengan keluarnya Silverlight 2 RC0 maka juga keluar Blend 2 SP1. Blend 2 ini berbeda dengan Blend 2.5 June Preview, jadi sudah dipastikan SP1 ini tidak akan berfungsi untuk Blend 2.5 June Preview. Jadi bagi yang ingin menggunakan SP1 ini dapat menginstall Blend 2. Blend 2 dan Blend 2.5 dapat diinstall bersamaan dalam 1 mesin.

Seperti yang telah diumumkan bahwa terdapat control baru pada SIlverlight 2 RC0, salah satunya adalah control ComboBox jadi tidak perlu repot-repot lagi menggunakan Liquid Control untuk mendapatkan control ini. Maka dengan menginstall Blend 2 SP1 ini kita dapat bekerja pada project SIlverlight 2 dan memanfaatkan control baru tersebut.

Kembali berbica tentang "motion path". Apakah "motion path" itu gerangan ? Bila anda bermain dengan Adobe Flash atau WPF, dijamin fasilitas ini akan ditemui sebagai fasilitas dalam lingkungan IDE. "Motion Path" adalah kurva (dapat berupa garis, persegi, lingkaran, ellips etc) yang akan menjadi garis gerak dari suatu objek.

Sebagai contoh, bila digunakan Blend 2 sebagai IDE untuk bermain dengan WPF. Maka dapat dibuat garis seperti pada gambar, dengan sebuah lingkaran yang akan menjadi objek yang akan berjalan-jalan di atasnya untuk menuju kotak yang merupakan "daerah abu-abu".

Pilih garus yang telah dibuat, kemudian pada menu pilih Object > Path > Convert to Motion Path. Maka dapat dilihat jendela seperti pada gambar berikut ini.

Pilih objek yang akan berjalan-jalan pada garis yang telah dibuat. Karena objek yang ingin berjalan-jalan di atas garis yang telah dibuat adalah ellips, maka pilih [System.Windows.Shapes.Ellipse]. Setelah itu dapat dilihat secara otomatis objek ellips langsung berada pada ujung garis tersebut. Seperti pada gambar di bawah ini.

Untuk melihat hasilnya, tinggal tekan tombol "play" yang dilingkari dengan "merah-putih" pada gambar di atas, maka akan terlihat gerakan objek bulat disepanjang garis tersebut.

Fasilitas tersebut hanya ada ketika bekerja di dalam project WPF. Bagaimana ketika sedang bekerja pada project Silverlight ? Ketika sebuah kurva dibuat dan dipilih maka dapat dipastikan fasilitas untuk membuat "motion path" tidak akan ditemui.

Hm....kapan fasilitas ini dapat dinikmati ? Tujuannya tentu saja untuk menghilangkan pekerjaan manual atau pemrograman yang biasa dilakukan untuk membuat hal seperti "motion path".

Share this post: | | | |

Simple Books

reyza — Thu, 25 Sep 2008 04:15:42 GMT

Sebelum berbuka....setelah sahur dan menunggu shalat subuh, maka buku-buku ini bisa jadi pilihan. Buku-buku yang telah membuat 7 tahun menjadi lebih bermakna di Bandung :)

Share this post: | | | |

ComponentArt Web.UI 2008.2 & Community Server 2008.5

reyza — Wed, 24 Sep 2008 05:48:35 GMT

{ComponentArt Web.UI 2008.2}

Pertama adalah komponen ASP.NET fav gw yaitu ComponentArt Web.UI, sekarang komponen ini sudah mencapat versi 2008.2.

Ada beberapa control baru pada versi ini yaitu :

ColorPicker

Control untuk pemilihan warna secara visual.

Input

Control Input ini dilengkapi pengecekan masukan berdasarkan pola yang diinginkan.

pada control ASP.NET standar hal yang sama dapat dilakukan dengan memanfaatkan Validator atau dapat dipercantik dengan bantuan Validator Callout dan MaskEdit milih AjaxControlToolkit.

Slider

Control ini bisa dimanfaatkan sebagai visualisasi untuk pager atau hal-hal lain seperti pengaturan volume dan lain-lain.

Control yang serupa juga dimiliki oleh AjaxControlToolkit dan dapat digunakan sebagai Pager Control bila menggunakan ListView.

Revamped Grid for ASP.NET Ajax

Control ini adalah Grid yang diberi sentuhan sorting dan juga kemampuan grouping saat sorting dilakukan.

{Community Server 2008.5}

Hal baru yang kedua adalah saat ini Community Server sudah mencapat versi 2008.5. Kenapa menarik? Karena pada versi ini terdapat tambahan feature yang menarik, yaitu Wiki.

Feature ini membuat Community Server makin cocok untuk mendukung kebutuhan web komunitas dan juga membuat Community Server makin mahal :)

Community Server Themes

Dengan adanya tambahan feature ini artinya ada pekerjaan tambahan untuk pembuatan theme untuk CS2008.5. Tambahan kerja tentu saja akan menaikkan tambahan yang menyenangkan untuk dinikmati. Karena mendengar selentingan kabar kalau awalnya 1 themes lengkap CS2008/CS2007 adalah $1000, sekarang untuk CS2008.5 menjadi $1500. Mantabs.

Community Server Evolution

Bila sedang berjalan-jalan di website official Community Server, maka pada bagian download yang bisa di akses di sini, ada link baru yang menarik yaitu Community Server Evolution. Ini dua file yang bisa diunduh yaitu CommunityServerEvolution_1.0.zip dan CommunityServer_For_SharePoint.zip. Ini adalah bentuk dukungan Telligent untuk integrasi antara Community Server dengan Sharepoint.

Belum banyak bisa bercerita tentang ini, karena kedua file itu belum diunduh. Lagi kekurangan bandwidth untuk mengunduh, maklum lagi berada di daerah yang kekurangan sinyal GRPS.

Selamat mecoba :)

Share this post: | | | |

Microsoft Health CUI : Silverlight 2 for Real LOB Application

reyza — Mon, 22 Sep 2008 17:28:43 GMT

Henry sudah menulis tentang rancangan "Indonesian Online IT Doctor" di sini, intinya kurang lebih rancangan aplikasi untuk layanan kesehatan. Seperti biasa, ketika ingin membangun aplikasi ada baiknya mencari terlebih dahulu "hal-hal" yang dapat membantu untuk membangun aplikasi tersebut, agar waktu tidak terbuang dengan membangun hal-hal yang telah dibuat.

Salah satu "hal-hal" yang dapat membantu realisasi "Indonesian Online IT Doctor" like ini adalah seperti yang telah dibuat dengan nama Microsoft Health Common User Interface.

Liat screenshot dibawah ini :

Demo aplikasi ini dibangun dengan Silverlight dan terdiri atas 3 demo yang dapat dicoba yaitu :

Demo 1, In waiting room : manage booking and find patiests.
Demo 2, with the family doctor : input and interact with the patient record.
Demo 3, at the hospital : explore and annotate investigation results.

Untuk menikmati ketiga demo tersebut dapat mengunjungi url berikut ini : http://www.mscui.net/PatientJourneyDemonstrator/

Cuma demo? Jangan kawatir, ada source code yang dapat digunakan baik bagi pecinta WPF dan Silverlight, yaitu :

MSCUI.msi (62359KB), Release of the CUI Toolkit including full source code for all controls, sample web site, sample WinForms application, test framework and help files.
MSCUI-NoSource.msi (3483KB), Release of the CUI Toolkit containing compiled binaries and help files only.
MSCui.Toolkit.zip (55966KB), Release of the CUI Toolkit in zip format including full source code for all controls, sample web site, sample WinForms application and test framework.

Ketiga file ini dapat diunduh dengan berkunjung ke url berikut : http://www.codeplex.com/mscui/

Selamat mengunduh dan mencoba :)

Share this post: | | | |

Silverlight Rich TextBox

reyza — Mon, 22 Sep 2008 17:18:42 GMT

Pernah bertemu dengan TinyMCE yang penampakannya seperti pada gambar berikut ini ?

Atau bila duit berlebih dan ingin server control ASP.NET yang langsung digunakan dapat memilih control Editor milik ComponentArt Web.UI.

Barang-barang di atas dapat digunakan bila ingin digunakan pada halaman dengan format HTML. Bagaimana bila ingin membuat hal yang sama tetapi pada halaman XAML pada Silverlight 2 ?

Bila ingin membuat hal yang serupa pada Silverlight 2, maka dapat menggunakan bantuan Silverlight 2 Beta 2 Liquid Control yang sebelumnya telah dibahas di sini.

Pada Liquid control terdapat control dengan nama Rich TextBox. Hasil akhirnya adalah seperti TinyMCE atau control Editor milik ComponentArt Web.UI, tetapi jangan berharap kemudahan yang sama akan didapat ketika menggunakan control Rich Textbox dari Liquid control.

Pada TinyMCE atau control Editor ComponentArt Web.UI, control ini langsung dapat digunakan secara terintegrasi. Terintegrasi yang saya maksudkan adalah area editor dan toolbar untuk mengubah style text (bold, italic, underline, tipe font, ukuran, warna dan lain-lain), insert gambar, membuat hyperlink, tombol undo dan redo dan lain-lain langsung dapat digunakan begitu control ini ditambahkan pada halaman HTML.

Bagaimana dengan control Rich Textbox milik Liquid control ? Jawabnya tidak perlu penjelasan panjang, cukup perhatikan langkah-langkah dan control berikut ini. Berikut adalah kode penggunaan control Rich Textbox :

<UserControl x:Class="LiquidRichTextBox.Page"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:liquid="clr-namespace:Liquid;assembly=Liquid"
    Width="400" Height="300">
    <Grid x:Name="LayoutRoot" Background="White">
        
        <liquid:RichTextBox x:Name="RichTextBox_Main"
                            VerticalAlignment="Top"
                            HorizontalAlignment="Left"
                            Margin="5,60,0,0"
                            Width="390"
                            Height="230"
                            BorderThickness="3"
                            BorderBrush="Black">
        </liquid:RichTextBox>

    </Grid>
</UserControl>

Dari contoh kode di atas dapat dilihat sudah ditambahkan control RichTextBox yang akan mempunyai lebar 390 pixel dan tinggil 230 pixel dengan lebar border 3 pixel dan warna hitam untuk border tersebut.....Build Solution....dan view in browser halaman, dan hasilnya ... seperti pada gambar berikut ini.

Sudah melihat antarmuka yang dihasilkan oleh control RichTextBox ? Yup...betuuul....cuma kotak dengan border warna hitam. Kita sudah dapat menuliskan text yang diinginkan pada area editor tersebut. Tetapi kemana tombol-tombol untuk mengubah text menjadi bold, italic, underline dan hal-hal lain yang ditemui pada TinyMEC atau control Editor milih ComponentArt Web.UI ?

Untuk mendapatkan tombol-tombol seperti itu pada control RichTextBox maka diperlukan kerja lebih. Misalnya ingin memiliki tombol yang mempunyai fungsi untuk mengubah text yang diseleksi menjadi tebal (bold) maka hal yang mesti dilakukan adalah :

Langkah pertama, terlebih dahulu buat tombol untuk keperluan itu dengan menggunakan baris kode seperti berikut :

<Button x:Name="Button_Bold"
        Click="Button_Bold_Click"
        Width="24" 
        Height="23" 
        VerticalAlignment="Top"
        HorizontalAlignment="Left"
        Margin="5,5,0,0">
    <Canvas>
        <TextBlock Text="B" 
                   FontWeight="Bold" 
                   FontSize="13" 
                   Canvas.Top="-3" 
                   Canvas.Left="3">
        </TextBlock>
    </Canvas>
</Button>

Maka hasilnya akan dilihat seperti paga gambar berikut :

Akhirnya satu tombol muncul juga. Dilihat dari kode di atas, pada control Button dapat dilihat terdapat Event Click yang akan memanggil method Buttond_Bold_Click. Artinya pada code file dari file Page.xaml mesti ditambahkan beberapa baris kode untuk melakukan proses "menebalan text yang diseleksi" ketika tombol Button_Bold diklik.

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

/* tambahkan kedua baris ini */
using Liquid;
using Liquid.Components;

namespace LiquidRichTextBox
{
    public partial class Page : UserControl
    {
        /* Style tidak aktif */
        private SolidColorBrush _buttonFillStyleNotApplied = 
            new SolidColorBrush(Color.FromArgb(255, 0, 0, 0));

        /* Style aktif */
        private SolidColorBrush _buttonFillStyleApplied = 
            new SolidColorBrush(Color.FromArgb(255, 255, 0, 0));

        public Page()
        {
            InitializeComponent();

            /* Mendaftarkan event */
            RichTextBox_Main.SelectionChanged += 
                new RichTextBoxEventHandler(RichTextBox_SelectionChanged);

        }

        /*
         * method ini dipanggil ketika pointer mouse berubah kedudukannya pada
         * area RichTextBox
         */
        private void RichTextBox_SelectionChanged(object sender, RichTextBoxEventArgs e)
        {
            Button_Bold.Background = _buttonFillStyleNotApplied;

            if (RichTextBox_Main.SelectionStyle.Weight == FontWeights.Bold)
            {
                Button_Bold.Background = _buttonFillStyleApplied;
            }
        }

        /*
         * Button_Bold berfungsi sebagai toggle, artinya bila style text yang
         * dipilih adalah Bold, maka ketika tombol diklik aksi yang dilakukan
         * adalah membuat text yang dipilih menjadi normal.
         */
        private void Button_Bold_Click(object sender, RoutedEventArgs e)
        {
            Formatting format = (Button_Bold.Background == _buttonFillStyleNotApplied ? 
                                 Formatting.Bold : Formatting.RemoveBold);
            RichTextBox_Main.ApplyFormatting(format, null);
            RichTextBox_Main.ReturnFocus();
        }
    }
}

Dapat dilihat pada kode di atas adalah kode untuk mengubah style text menjadi "cetak tebal", bagaimana untuk membuat fasilitas italic, underline, mengubah ukuran font dan lain2 ? Caranya "sederhana", cukup lakukan hal yang sama seperti contoh di atas :)

Untuk contoh lengkap code ini beserta solution-nya dapat diunduh di sini.

Share this post: | | | |