#550 – Converting a Brush into a Resource in Blend

May 3, 2012 4 Comments

Once you spend some time creating a Brush in Blend, e.g. specifying the different colors in a gradient brush, it’s likely that you’ll want to use the same brush in several different spots in your user interface.  You could just copy/paste the definition of the brush in XAML.  But the easier way to reuse a brush is to convert it to a resource and then to reference the resource by name wherever you use it.

To start with, assume that we have a linear gradient brush defined for a Label control’s Background.

Start by clicking on the white square (Advanced Options) to the right of the brush-related property.

On the menu that comes up, select Convert to New Resource.

Specify a name for the new resource.

Notice that the XAML now defines the brush as a resource and then references it from the Label.

Filed under Blend Tagged with , , ,

#548 – Change the Offset of a Gradient Stop in Blend

May 1, 2012 Leave a comment

Once you’ve added one or more gradient stops to a gradient brush, you can use the mouse to drag any of the gradient stops left or right.  Dragging a gradient stop changes the value of its Offset, which dictates where along the gradient line the specified color is achieved for the gradient.

For example, let’s say that we start with a simple gradient that goes from Blue at the top of a control to white at the bottom of a control.  The gradient line runs from the top of the control (Y=0) to the bottom (Y=1).  The first gradient is at an offset of 0 (top of control) and the second gradient is at an offset of 1 (bottom of control).

You can now move one of the gradient stops by sliding it.  This will change the value of its Offset, changing where on the gradient line that color is reached.

Filed under Blend Tagged with , , ,

#547 – Specifying Colors by Name in Blend

April 30, 2012 1 Comment

When you are specifying color values for a color-valued property in Blend, there are several different ways to specify a color.  You can select a color by selecting it from the palette, use the eyedropper tool, or enter RGB values directly.

You can also specify a color by entering a color value by name in the text field that initially displays the color as a hex value.

Below is a list of all predefined colors, which you can reference by name.

 

Filed under Blend Tagged with , ,

#546 – Adding Gradient Stops in Blend

April 27, 2012 3 Comments

A gradient fill can have a number of different stops–positions within the gradient that should take on a color value that you specify.

To add or remove stops for a gradient, start by selecting the control containing a property that you’ll set to a gradient.  (E.g. The Background property of a Label).

In the Brushes area of the Properties panel, click the icon for a Gradient brush.

Now we have a gradient with two gradient stops, going from all black at the top of the control to all white at the bottom.

You can click anywhere within the gradient line to add a gradient stop.  Once added, click on the gradient that you want to change and then select a color for the gradient on the color palette.

We can continue adding as many gradient stops as we like.

Filed under Blend Tagged with , , , ,

#545 – Locking Objects to Prevent Changes

April 26, 2012 1 Comment

When you’re working in Blend to design your user interface, you’ll often spend a lot of time setting properties for controls to get them to look just the way you want them.  Once you get a control set the way you want it, you can lock it to prevent inadvertently changing it as you work with other controls in your user interface.

To lock a control, left-click on the small circle at the far right of the line representing your control in the Objects and Timeline panel.

Once you click on this lock icon, the circle will change to look like a little lock.  At this point, you won’t be able to change the control from the artboard or the Properties panel.  You can also no longer select the control in the Objects and Timeline panel.  You can still change properties of the control, however, by editing its XAML directly.

Filed under Blend Tagged with , , ,

#544 – Objects and Timeline Panel Shows the Logical Tree

April 25, 2012 Leave a comment

In Blend, the Objects and Timeline panel, normally in the lower left corner of the user interface, shows the logical tree of all the objects currently shown on your artboard.

You can click on individual elements on the Objects and Timeline panel and the corresponding object on the artboard will be selected, as well as the matching XAML tag in the XAML editor.

You can temporarily hide objects and their child objects by clicking on the eyeball icon.  The object and all of its children will disappear from the artboard.  The object will still appear at runtime–hiding a control in this manner only hides it in the context of the editor in Blend.

Filed under Blend Tagged with , ,

#543 – Searching for Controls in the Assets Panel

April 24, 2012 Leave a comment

While the Assets Panel is open, you can search for individual controls if you know the name, or part of the name.

Once you open the assets panel, you’ll see a search box that you can type in.

You can start typing a portion of the name of a control and your list will be limited to only controls whose name contains the text that you typed.

This will also work if you’re in the Grid mode, displaying controls as icons, rather than in a list.

Filed under Blend Tagged with , ,

#542 – Most Recently Used Asset

April 23, 2012 1 Comment

You can use the Assets Panel in Blend to add any available control to your user interface.  In the example below, we’ve added a DatePicker control.

You’ll notice that when you add a control to your user interface from the assets panel, a new icon appears on the Tools Panel, at the bottom.  This icon will always represent the control that you most recently added to your user interface.

Looking at the previous screenshot, you can see that an icon for the DatePicker control has been added to the tools panel.

Once the icon has been added to the tools panel, you can add additional instances of this control by double-clicking on the icon.

You can also left-click and hold to see a list of all of the recent controls that you have added.

Filed under Blend Tagged with , ,

#541 – Adding Elements from The Assets Panel in Blend

April 20, 2012 1 Comment

You can quickly add a large number of controls to your user interface in Blend using the corresponding icon on the tools panel.  However, for controls not available normally from the tools panel, you can add elements from the  Assets Panel.

To open the assets panel, click on the Assets tab that normally appears just to the right of the Projects tab in Blend.

You can explore within the listed menus to find the component that you’d like to add to your application.  Once you find a control that you want included, you can double-click to include it under the currently selected panel, or left-click and drag it to the artboard.

 

Filed under Blend Tagged with , , ,

#540 – Adding Common Controls in Blend

April 19, 2012 1 Comment

You can add various common controls to your application in Blend using buttons on the tools panel.  You select the icon for the control that you want to add and then double-click the icon to add it.

If you left-click and hold on the Button icon on the tools panel, or right-click, you’ll see a series of controls that you can insert by clicking on the icon at this location in the tools panel.

  • Button – Click on a button to perform some action
  • CheckBox – Check an item in a list
  • ComboBox – Select an item from a dropdown list
  • ListBox – Select an item from a list
  • RadioButton – Select one item from a group
  • ScrollBar – Scroll stuff
  • Slider – Pick a value from a range
  • TabControl – Switch between separate tabbed parts of app
  • GridSplitter – Make section of app bigger/smaller

Select the control that you want and then double-click to add to your GUI.

Filed under Blend Tagged with , , , ,

← Older posts

Newer posts →

Follow

Get every new post delivered to your Inbox.

Join 129 other followers