রবিবার, ২ জানুয়ারী, ২০১১

Create a User Control using SL4 and Expression Blend 4.0

In this blog I shall discuss about Controls of Silverlight.

What is Control?

  1. Element of Software
  2. Encapsulate some User Interface related functionality
  3. There are two types of control:
    1. User Control
    2. Custom Control

a. User Control:

i. User Control is logical group of other controls.

ii. Typically used to separate a user interface in smaller parts that are easier to code and design.

iii. Following Example defines how to create a user control using Silverligt 4

I. Open VS-2010

II. Create a Silverlight Project Named it MyUserControlProject

III. Right Click on Silverlight Project from Solution Explorer

IV. Add->New Item->Silverlight User Control-> Named it MyUserControl.xaml->Add

V. From toolbox drag some controls i.e- Text Block, Combo Box, List Box etc and drop them on MyUserControl

VI. From Menu Select Build->Build Solution

VII. After Build the MyUserControl named User Control Icon should be available in Tool Box.

VIII. This Control should be use any page of this project by drag and drop the icon from toolbox.

iv. Following Example shows how to create a User Control from Expression Blend:

I. Open Expression Blend 4.

II. File-> New Project-> Silverlight Application

III. In Main.xaml drag some controls from Toolbox.

If all controls are not available then Go to Asset Tab->Controls-> Here All controls should be available.

IV. Drag Necessary Controls from Toolbox and Asset->Controls

V. Select Controls

VI. Click Right Mouse

VII. Make into User Control named MyNewUserControl

VIII. After Naming Click Ok. As a result all user control should be group and a New User Control should be create which name is MyNewUserControl.

IX. Now you will be able to change the place of group.

X. From Menu Select Build-> Build Project

XI. After build the project a icon of User Control Named MyNewUserControl should be create in Project of Asset Tab.

XII. This user control should be use any page of this project by drag the icon and drop it inside the page.

কোন মন্তব্য নেই:

একটি মন্তব্য পোস্ট করুন