#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.

 

Advertisement

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 , , , ,

#539 – Adding Text-Based Elements in Blend

April 18, 2012 1 Comment

You can add text-based controls to your user interface by clicking on one of the related icons on the tools panel in Blend.

If you left-click and hold on the TextBlock 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.

  • TextBlock – Displays a small amount of text.  Similar to Label, but more lightweight (e.g. can’t customize with templates)
  • TextBox – Displays some user-editable text
  • RichTextBox – Displays user-editable text and allows for more rich formatting
  • PasswordBox – Allows user to enter a password, hiding the characters entered
  • Label – Displays a small amount of text
  • FlowDocumentScrollViewer – Host a FlowDocument to display an entire document, with support for scrolling

Select the control from this list that you want and then double-click the icon on the tools panel to insert an instance into your user interface.

Filed under Blend Tagged with , , , , , , ,

#538 – XAML End Tags Are Automatically Added as Needed in Blend

April 17, 2012 Leave a comment

When you first add an element to your user interface in Blend using one of the buttons on the tools panel, the corresponding XAML element does not typically hand an end tag.

For example, in the image below, we have a StackPanel element without an end tag (<StackPanel/>), rather than paired with an end tag (<StackPanel></StackPanel>).

If you now add a child element to the StackPanel using one of the buttons on the tools panel, Blend will automatically add the required end tag.

If you later delete the Button using the Objects and Timeline panel, removing all child elements from the StackPanel, the end tag is automatically removed.

Filed under Blend Tagged with , ,

← Older posts