ResizeGrip - Resizing (Mostly Custom) Windows

ResizeGrip - Resizing (Mostly Custom) Windows

 

ResizeGrip 클래스

업데이트: 2007년 11월

Window가 크기를 변경할 수 있도록 하는 Thumb 컨트롤의 구현을 나타냅니다.

ResizeGrip - Resizing (Mostly Custom) Windows

August 18th, 2008     |     9 Comments

In my most recent article, I write about how you can easily create a custom window. Custom windows are interesting because, for better or for worse, you get to override the default OS titlebar, minimize/maximize/close buttons, and related functionality. in favor of your own custom implementation:

The benefit is obvious. You can really set your application apart by providing your own window design. The downside is that you have to re-create all of the window functionality yourself. Things like dragging a window, minimizing, maximizing, and closing are not free. They aren’t particularly hard either, and I provide the code snippets for them at the end of my article. What isn’t trivial, though, is being able to resize a window.

In this post, I will provide a cheap solution for the window resizing problem. In a future post, I will talk about how to resize using a non-cheap but arguably better solution.

The ResizeGrip Control
When you make your window transparent, resizing (one of the features you normally would take for granted) is no longer available:

To help with that, you have what is known as the ResizeGrip control:

The ResizeGrip control, by default, positions itself on the bottom-right corner of your application window. When you hover over it with your mouse, you will get the familiar resize handles that indicate you can click and drag to resize your application as necessary:

Because of its position and orientation, you will only be able to resize in a NW-SE (Northwest-Southeast) manner. At least, it is better than not being able to resize your application at all.

Using ResizeGrip
To use the ResizeGrip control, you can’t just drag and drop it into your window via the Asset Library using Expression Blend. Actually, you can, but it won’t do anything such as actually resizing your application when you click and drag it around. The way to add a ResizeGrip to your application is to select your Window in your Object Tree in Expression Blend:

After you have done that, take a look in the Common Properties category in your Properties Inspector. There should be a drop-down menu labeled ResizeMode. Click on it and select the CanResizeWithGrip item:

Once you have done that, you will see your ResizeGrip control appear on the bottom-right corner of your window. If you run your application, you will be able to resize your application by using the ResizeGrip control.

Why I Don’t Prefer the ResizeGrip Control
If you are in a rush and need to get something that enables resizing, the ResizeGrip is a great solution. My biggest problem with it is that it breaks the expectations your users would have when using your application. When you go with a custom window style to emulate a traditional window but fail to provide obvious functionality like 8-sided resizing, then you need to evaluate whether a custom design is worth the tradeoff. The answer may well be "Yes", so don’t feel that not having proper resizing automatically rules out having custom window styles.

In a future post, I will describe how to implement window resizing by writing some code. It will be a great example of the old phrase, "No pain, no gain!"