itemcontainerstyle

How Do I Style The ComboBox Items?

by Matthias Shapiro
Blend, combobox, How To..., Tutorial, WPF, XAML

This is actually a continuation of my post on getting the ComboBox items to accept text wrapping, so I’ll be working from that point forward. If you’re coming fresh into this, you won’t be missing anything… but that is my explaination for the pictures containing wrapping text.

When last we left our heroes, we has a couple problems. The first was that our items were either black text on a white background and ran together in a very un-designer-y way.

BeginningViewComboStyling

The second was that the selected item background makes your eyes bleed such a horrid blue color you’ll feel like Paul Atreides staring at a stone burner.

Was that a little too geek? My apologies.

The WPF Designers Guide to Styling The ComboBox

by Matthias Shapiro
combobox, WPF, WPF Designer Guides, XAML

The ComboBox is not the most complex of the WPF applications, but it can be a little tricky, so lets do a general overview post of it before we go into the specifics of how we’re going to make it work.

First of all, if you’re going to test your comboBox design, you should have it hooked up to an ItemsSource. Don’t have one? I have a tutorial in which I walk through attaching an RSS feed to your control. It was originally written for the ListView, but it will work fine for a ComboBox.

To start out… this is your standard ComboBox:

unalteredComboBox

When working on a comboBox, you have a couple of options for the Items inside the ComboBox. If the options never change and are not data-driven, you can just toss come ComboBoxItems into it. Otherwise, you can connect it to some kind of ItemsSource (see the link above).

All of my examples are done with a data-driven ComboBoxes, but you should get the desired results if you run through the tutorials with ComboBoxItems.

First, a little bit about the structure of the comboBox.

Styling ListView Items Using Blend

by Matthias Shapiro
Blend, How To..., listview, WPF

So… you’ve got your listview and you want your items to look a certain way. In this post, we’ll look at changing as many things as we can inside the ListView ItemContainerStyle.

First things first… getting to the ItemContainerStyle using Blend. With the ListView selected, go to the top menu and click:

Edit Other Styles -> Edit ItemContainerStyle -> Create Empty…

ItemContainerStyleMenu

Name your Style and you get tossed into Style editing. Here, you can do all sorts of great things, like… um… changing the background or something.

How Do I Center Something In My ListView Column?

by Matthias Shapiro
Blend, listview, WPF, XAML

So the items in your ListView column look like this:

Centered Example 1

And you want them to look like this:

Centered Example 2

If you’re trying to center something within a ListView column, it’s actually pretty simple.

How Do I Set Up Grid Lines for my ListView?

by Matthias Shapiro
How To..., listview, XAML

So you want grid lines in your listview, huh? Something that looks a little like this?

OK, we can do this the easy way and the hard way.
Read More »How Do I Set Up Grid Lines for my ListView?

The WPF Designer Guide To Styling the (your-favorite-adjectival-swear-word-here) ListView

by Matthias Shapiro
Blend, listview, WPF, WPF Designer Guides, XAML

So, after months of delay I finally figured that there are probably some people out there who want to figure out how to make the WPF listview look the way they want it to look.

A quick note: I will be dealing almost entirely with the listview look. If you want the listview to do something (functionality) or look a certain way and you can’t find the answer here, leave a comment with your suggestion and I’ll try to blog about it and place a link to the answer in my listview FAQ.

My goal is to create a significant repository on getting the stinking listview to look the way you want and do what you want it to do.

You’re probably here because, compared with most of the WPF controls, Blend gives very little guidance on how to deal with the listview (even though you use the listview for practically everything you do). So we’re going to start with the basic structure of the listview. This is what the basic listview looks like in the XAML.

So this post will start out giving basic guidance on what to edit when you’re trying to edit the various parts of the listview. I will update these sections with links and tutorials on listview specific tasks as time goes on.