Blackberry User Interface Design - Customizable UI? - user-interface

I am trying to design a Blackberry Application and I am wondering if there are any resources on how to create custom user interface elements, skin existing ones and what other possibilities are there?
I have developed a few iPhone applications with custom UI and stuff, so not sure what BB world offers in terms of UI development.
Any tips, suggestions or ideas would be great.

There are no skins in Blackberry, two ways I know to achive skin effect are
create own theme
create custom controls
Create BlackBerry Theme
removed dead Imageshack link - BlackBerry Theme Builder
What can you do with Theme Builder?
Some of its main features allow you
to:
Customize the BlackBerry application icons
Change the Home screen banner image and icon/indicator colors
Create your own buttons
Customize the look of dialog and pop up screens
Customize an idle screen
Customize the look of menus and lists
Customize the phone application screens
Customize fonts used on the BlackBerry device
How To Create Your Own Personal Blackberry Themes by BrileyKenney
bb dev journal - Just Theme It!
BlackBerry Themes & Animated Graphics
Bad news - theme is applied to whole device OS and each application
Althought created theme may be a standalone software design product, I don't think it's a great idea to create own theme for developed application.
Design Mockup
Programming gui may take some time and in case you want to resolve some questions in GUI planning without coding, you may want to draw GUI mockup.
You can use free BlackBerry UI Prototyping Visio Stencils - v1.0 from ArtfulBits.
removed dead Imageshack link
removed dead Imageshack link
Creating custom control
By creating custom control you can configure
control size
control shape
control background (color, image)
control font (size, style, color)
control border (size, style, color)
All of this for states
disabled
normal
focused
active (clicked)
In the end you can simply skinn your control by setting background image
Basics
devsushi.com: Blackberry JDE API - User Interface Field Reference will basically give the idea of existent blackberry ui controls, with codesnippets and screenshots.
SO: Add items to a ListField ( BlackBerry )
SO: Embedded HTML control for Blackberry?
SO: Blackberry - how to get datetime value from DateField?
SO: Styling a BlackBerry Application to Look Like an iPhone
Managers, layout
Even using standard controls, we need to layout and group the way we want, thus we need custom managers:
Thinking BlackBerry: BlackBerry UI - Creating a basic field manager
Thinking BlackBerry: Simple BlackBerry Grid Layout Manager
Thinking BlackBerry: Making a Custom Screen, Vertically Scrolling and more
SO: Scrolling problem in Blackberry application
SO: How to set a ScrollBar to the VerticalFieldManager in Blackberry?
Wireless: Create a custom layout manager for a screen
SO: Blackberry - get all child fields of control
SO: Cancel scrolling in Layout Manager
SO: Creating custom layouts in BlackBerry
SO: Blackberry setting the position of a RichtextField in FullScreen
SO: Fun with Field Managers
SO: BlackBerry - Custom menu toolbar
SO: BlackBerry - Custom centered cyclic HorizontalFieldManager
Custom controls
Set of articles about writing custom controls:
Thinking BlackBerry: BlackBerry UI - A simple custom field
Coderholic: Blackberry Custom Button Field
Wireless: Create your own VirtualKeyboard for BBStorm
Wireless: ListField with check boxes
CodeProject: Creating a XY Chart/Plot as a BlackBerry Custom Field
SO: Blackberry - Custom size EditField
SO: Blackberry - How to add border to BasicEditField?
SO: Blackberry - Setting LabelField background color
SO: Blackberry change color of child fields on horizontal manager focus
SO: Setting background and font colors for RichTextField, TextField
SO: Blackberry Java: TextField without the caret?
SO: Image Map-like Blackberry Control - CLDC Application
SO: Blackberry - single line BasicEditField with large text
SO: Blackberry - custom BubbleChartField
SO: Blackberry - get checked items from list with checkboxes
SO: BlackBerry - Creating custom Date Field
SO: BlackBerry - How to create sub menu?
SO: BlackBerry - How can i show a Label with emoticons??
SO: BlackBerry - Show typing mode indicator programmatically
Graphics, animation
SO: BlackBerry - draw image on the screen
SO: Blackberry - background image/animation RIM OS 4.5.0
SO: Blackberry - Loading screen with animation
SO: How to set Anti Aliasing in Blackberry Storm?
SO: Blackberry setting a clipping region/area
SO: Is it better to use Bitmap or EncodedImage in BlackBerry?
SO: Blackberry - fields layout animation
Fonts
Wireless: Change fonts in a BlackBerry application
Developer Journals: Fonts
SO: How do I create a custom font for a blackberry application
SO: How to set a font to LabelField text in Blackberry?
SO: How to make Blackberry UI more attractive?
SO: How to change the font color of blackberry label field dynamically?
SO: BlackBerry - Unicode text display

Example of standard Media application skin on Bold 9000
removed dead ImageShack link - sliced Media application
removed dead ImageShack link - Sliced images
Use extention of ButtonField to map images with buttons:
class BitmapButtonField extends ButtonField {
Bitmap mNormal;
Bitmap mFocused;
Bitmap mActive;
int mWidth;
int mHeight;
public BitmapButtonField(Bitmap normal, Bitmap focused,
Bitmap active) {
super(CONSUME_CLICK);
mNormal = normal;
mFocused = focused;
mActive = active;
mWidth = mNormal.getWidth();
mHeight = mNormal.getHeight();
setMargin(0, 0, 0, 0);
setPadding(0, 0, 0, 0);
setBorder(BorderFactory
.createSimpleBorder(new XYEdges(0, 0, 0, 0)));
setBorder(VISUAL_STATE_ACTIVE, BorderFactory
.createSimpleBorder(new XYEdges(0, 0, 0, 0)));
}
protected void paint(Graphics graphics) {
Bitmap bitmap = null;
switch (getVisualState()) {
case VISUAL_STATE_NORMAL:
bitmap = mNormal;
break;
case VISUAL_STATE_FOCUS:
bitmap = mFocused;
break;
case VISUAL_STATE_ACTIVE:
bitmap = mActive;
break;
default:
bitmap = mNormal;
}
graphics.drawBitmap(0, 0, bitmap.getWidth(), bitmap.getHeight(),
bitmap, 0, 0);
}
public int getPreferredWidth() {
return mWidth;
}
public int getPreferredHeight() {
return mHeight;
}
protected void layout(int width, int height) {
setExtent(mWidth, mHeight);
}
}
put HorizontalFieldManagers inside VerticalFieldManagers and vice versa
use different images for normal, focused and active states
if you need a custom shaped buttons, you can draw them over in manager paint() method override, after super.paint()
Rest part of code:
class Scr extends MainScreen implements FieldChangeListener {
Bitmap mBmpHeader = Bitmap.getBitmapResource("header.png");
Bitmap mBmpCover = Bitmap.getBitmapResource("cover.png");
Bitmap mBmpTitle = Bitmap.getBitmapResource("title.png");
Bitmap mBmpTimeline = Bitmap.getBitmapResource("timeline.png");
Bitmap mBmpLeftside = Bitmap.getBitmapResource("leftside.png");
Bitmap mBmpPrevNrm = Bitmap.getBitmapResource("btn_prev_normal.png");
Bitmap mBmpPlayNrm = Bitmap.getBitmapResource("btn_play_normal.png");
Bitmap mBmpPauseNrm = Bitmap.getBitmapResource("btn_pause_normal.png");
Bitmap mBmpStopNrm = Bitmap.getBitmapResource("btn_stop_normal.png");
Bitmap mBmpNextNrm = Bitmap.getBitmapResource("btn_next_normal.png");
Bitmap mBmpPrevFcs = Bitmap.getBitmapResource("btn_prev_focused.png");
Bitmap mBmpPlayFcs = Bitmap.getBitmapResource("btn_play_focused.png");
Bitmap mBmpPauseFcs = Bitmap.getBitmapResource("btn_pause_focused.png");
Bitmap mBmpStopFcs = Bitmap.getBitmapResource("btn_stop_focused.png");
Bitmap mBmpNextFcs = Bitmap.getBitmapResource("btn_next_focused.png");
Bitmap mBmpRightside = Bitmap.getBitmapResource("rightside.png");
VerticalFieldManager mMainManager;
HorizontalFieldManager mHeaderManager;
HorizontalFieldManager mCoverManager;
HorizontalFieldManager mTitleManager;
HorizontalFieldManager mTimelineManager;
HorizontalFieldManager mToolbarManager;
BitmapField mHeader;
BitmapField mCover;
BitmapField mTitle;
BitmapField mTimeline;
BitmapField mLeftside;
BitmapField mRightside;
BitmapButtonField mBtnPrev;
BitmapButtonField mBtnPlay;
BitmapButtonField mBtnPause;
BitmapButtonField mBtnStop;
BitmapButtonField mBtnNext;
public Scr() {
add(mMainManager = new VerticalFieldManager());
addHeader();
addCover();
addTitle();
addTimeline();
addToolbar();
}
private void addHeader() {
mMainManager.add(mHeaderManager = new HorizontalFieldManager());
mHeaderManager.add(mHeader = new BitmapField(mBmpHeader));
}
private void addCover() {
mMainManager.add(mCoverManager = new HorizontalFieldManager());
mCoverManager.add(mCover = new BitmapField(mBmpCover));
}
private void addTitle() {
mMainManager.add(mTitleManager = new HorizontalFieldManager());
mTitleManager.add(mTitle = new BitmapField(mBmpTitle));
}
private void addTimeline() {
mMainManager.add(mTimelineManager = new HorizontalFieldManager());
mTimelineManager.add(mTimeline = new BitmapField(mBmpTimeline));
}
private void addToolbar() {
mMainManager.add(mToolbarManager = new HorizontalFieldManager());
mToolbarManager.add(mLeftside = new BitmapField(mBmpLeftside));
mToolbarManager.add(mBtnPrev = new BitmapButtonField(mBmpPrevNrm,
mBmpPrevFcs, mBmpPrevFcs));
mToolbarManager.add(mBtnPlay = new BitmapButtonField(mBmpPlayNrm,
mBmpPlayFcs, mBmpPlayFcs));
mBtnPlay.setChangeListener(this);
mBtnPause = new BitmapButtonField(mBmpPauseNrm, mBmpPauseFcs,
mBmpPauseFcs);
mBtnPause.setChangeListener(this);
mToolbarManager.add(mBtnStop = new BitmapButtonField(mBmpStopNrm,
mBmpStopFcs, mBmpStopFcs));
mToolbarManager.add(mBtnNext = new BitmapButtonField(mBmpNextNrm,
mBmpNextFcs, mBmpNextFcs));
mToolbarManager.add(mRightside = new BitmapField(mBmpRightside));
}
public void fieldChanged(Field field, int context) {
if (mBtnPlay == field)
play();
else if (mBtnPause == field)
pause();
}
private void pause() {
mToolbarManager.replace(mBtnPause, mBtnPlay);
}
private void play() {
mToolbarManager.replace(mBtnPlay, mBtnPause);
}
}

The resources aren't very good unfortunately. The best source of information is usually Google linking to blogs with the specific topic you're looking for.
If you're just beginning to write BB GUI code, I would highly recommend getting to know the Manager and Field classes since you'll probably have to write many custom extensions of them.

Related

Changing size of Xamarin Flyout page

I'm trying to make a Flyout page (previously MasterDetailPage) take up a 1/3 of the screen for the Flyout and 2/3 for Detail.
I was able to accomplish this on iOS by using a custom renderer that's a modification of the Xamarin.Form's Flyout implementation
But there isn't any such implementation for Android and I can't figure out how to accomplish this.
Anyone know how to do this?
You could use custom renderer to do that.
The renderer of FlyoutPage in Android is FlyoutPageRenderer. The following link lists the renderer and native control classes that implement each Xamarin.Forms Page type:
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/custom-renderer/renderers
The source code of FlyoutPageRenderer:
https://github.com/xamarin/Xamarin.Forms/blob/5.0.0/Xamarin.Forms.Platform.Android/AppCompat/FlyoutPageRenderer.cs
You could get the field _flyoutLayout in source code. Then, you could set the height and width like the code below.
[assembly: ExportRenderer(typeof(FlyoutPage), typeof(FlyoutPageCustomRenderer))]
namespace App14.Droid
{
class FlyoutPageCustomRenderer: FlyoutPageRenderer
{
public FlyoutPageCustomRenderer(Context context) : base(context)
{
}
protected override void OnElementChanged(VisualElement oldElement, VisualElement newElement)
{
base.OnElementChanged(oldElement, newElement);
var fieldInfo = GetType().BaseType.GetField("_flyoutLayout", System.Reflection.BindingFlags.Instance | System.Reflection.BindingFlags.NonPublic);
var _flyoutLayou = (ViewGroup)fieldInfo.GetValue(this);
var lp = new LayoutParams(_flyoutLayou.LayoutParameters);
lp.Width = 400;
lp.Height = 600;
lp.Gravity = (int)GravityFlags.Left;
_flyoutLayou.LayoutParameters = lp;
}
}
}
For better effect, i set the background color to pink. The background color is set in flyout menu page.
If you wanna more information about the FlyoutPage, you could refer to the MS docs.
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/navigation/flyoutpage

Libgdx FreeTypeFont: font generated dynamically doesn't scale in Label

I'm trying to figure out how to realize the HUD interface for my brand new game.
I wanted to create it by using the scene2d.ui set of widgets because I've heard that it's more suitable for a responsive UI.
So, I'm trying to create a simple HUD in which there's a score Label aligned at the top-right side of the screen and a pause Button placed on the top-left side of the screen.
Now... I'm using a root Table (as explained in the Table guide https://github.com/libgdx/libgdx/wiki/Table#quickstart) that fills the stage.
I wanted to create a custom class for handling all the hud interface such as:
public class Hud extends Table{
private Label scoreLabel;
private Button pauseButton;
public Hud(){
setFillParent(true);
BitmapFont font = (BitmapFont) MyGame.assetManager.get(Constants.COUNTERS_FONT_NAME);
LabelStyle labelStyle = new LabelStyle(font,Color.WHITE);
scoreLabel = new Label("score:0", labelStyle);
add(scoreLabel).width(2).height(1);
}
}
The issue I'm fighting with is the following: the text inside the Label does not stay inside the Label.
I mean: activating the debug mode I can see the rectangle representing the Label with the correct dimensions...but the text is completely out of bounds and does not scale.
As you can see the font I use is a BitmapFont that is generated when the Game starts via the library FreeTypeFont...The font is then added to the AssetsManager of the game.
I post the code I use for adding the font generator to the assets manager:
//Register the FreeTypeFontGeneratorLoader
InternalFileHandleResolver resolver = new InternalFileHandleResolver();
assetManager.setLoader(FreeTypeFontGenerator.class, new FreeTypeFontGeneratorLoader(resolver));
assetManager.setLoader(BitmapFont.class, ".ttf", new FreetypeFontLoader(resolver));
//Load fonts
FreeTypeFontLoaderParameter countersFontParameters = new FreeTypeFontLoaderParameter();
countersFontParameters.fontFileName = Constants.BASE_FONT_NAME;
countersFontParameters.fontParameters.size = 45;
countersFontParameters.fontParameters.borderColor = Color.BLACK;
countersFontParameters.fontParameters.borderWidth = 1;
assetManager.load(Constants.COUNTERS_FONT_NAME, BitmapFont.class, countersFontParameters);
As you can see I load just one BitmapFont with a size of 45 pixels.
I don't know what the problem is; I would like to try with a classic BitmapFont .fnt in order to see if the problem is in the way the BitmapFont is generated but I'd also like to keep the FreeTypeFont solution.
Thanks in advance,
Luca
P.S.
One thing about the Stage... it uses a ScalingViewport so the dimensions are not in pixels but in virtual units (because my Game uses Box2d and I need a common unit both for the rendering and the physic simulation).
I'm pretty sure that Label will not respond on automatic scaling of the viewport until you will call label.setFontScale( theScale ) explicite.
The best idea here, in my opinion, will be to create another stage exclusively for a HUD so you will have your stage with ScalingViewport (I admit I've never used this one - isn't it better to use some Fill or aomething like this one?) and another stage with FitViewport above for example.
I find it very reasonable and intuitive since it will be like having your HUD displayed on yours car windscreen when driving the car.
The code should looks like:
//in your show method
viewport = createYourScalingViewport();
stage = new Stage();
stage.setViewport(viewport);
HUDviewport = new FitViewport(screenWidth, screenHeight);
HUDstage = new Stage();
HUDstage.setViewport(HUDviewport);
...
//adding some actor to stages
stage.addActor(actor1);
stage.addActor(actor2);
//BUT
HUDstage.addActor( yourHudInstance );
...
//then in your render method act() and draw() stage then HUDstage so the HUD will be above stage
stage.act();
stage.draw();
HUDstage.act();
HUDstage.draw();
Remember of updateing HUDviewport in case of window resizing in the resize Screen method
I guess I've solved my problem.
It seems to be that it doesn't make sense to set the label dimensions.
If anyone needs to have a container that was tight to the text is rendered inside the label the best solution is to create a custom class like this below that extends an HorizonaltGroup (o VerticalGroup).
Let's imagine I need a score label for my game:
public class ScoreLabel extends HorizontalGroup{
...
}
Inside this class I create a Label property and I add it as an Actor.
public class ScoreLabel extends HorizontalGroup{
private Label scores;
public static final float FONT_SCALE = 0.9f;
public ScoreLabel(){
BitmapFont font = MyGame.assetManager.get(Constants.COUNTERS_FONT_NAME);
LabelStyle labelStyle = new LabelStyle(font, Color.WHITE);
scores = new Label(getScoreText(), labelStyle);
scores.setAlignment(Align.left);
scores.setFontScale(FONT_SCALE);
addActor(scores);
}
}
If you activate the debug mode you'll notice that there's a container that is perfectly tight to the text is rendered.
The code above simply loads a BitmapFont previously loaded inside the game assets manager.
Then a font scale is applied...I guess it could be added inside a skin property
Anyway...This is the best solution for me.
I'm still using a stage with a ScalingViewport, in this way I have not to use pixels as unit and all the dimensions are scaled to fill the device screen.
Bye,
Luca

Image/Photo gallery like built-in WP7

I'm looking for a photo gallery for Windows Phone 7. Something that looks and works the same as the built-in photo viewer (slide photo's using a flick action, resize using pinch, drag). When you flick the image you can see it sliding to the next image...and snaps the list to that image.
I already built the resize and drag functionality for the images. I just can't figure out how to create the actual photo slider.
Can anyone point me into the right direction?
Things i've tried:
Pivot Viewer (doesn't work because it interferes with the drag functions of the image, haven't been able to disable the pivot viewer touch)
Plain listbox (can't find how to snap to the current image)
Thanks in advance
Actually I've implemented exactly what you are saying in one of my apps,
You need to use Silverlight Control TOolkit's gesture listener to capture Drag and Pinch from touch.
define a CompositeTransformation for your image and set it's scale (on pinch) and Offset (in drag).
Obviously when the image is not zoom, drag can trigger going to next image.
To make it feel smoother, you may want to define a storyboard on your page resources to use (instead of just settings Offset)
I hope it can help/
Drag handlers pseudo code for slider effect:
<Canvas>
<Image x:Name="imgImage" Source="{Binding ...}" Width="..." Height="...">
<Image.RenderTransform>
<CompositeTransform x:Name="imgImageTranslate" />
</Image.RenderTransform>
</Image>
</Canvas>
private void GestureListener_DragCompleted(object sender, DragCompletedGestureEventArgs e)
{
if (e.Direction == System.Windows.Controls.Orientation.Horizontal)
{
var abs = Math.Abs(PANEL_DRAG_HORIZONTAL);
if (abs > 75)
{
if (PANEL_DRAG_HORIZONTAL > 0) // MovePrevious;
else //MoveNext();
e.Handled = true;
}
}
}
double PANEL_DRAG_HORIZONTAL = 0;
private void GestureListener_DragDelta(object sender, DragDeltaGestureEventArgs e)
{
if (e.Direction == System.Windows.Controls.Orientation.Horizontal)
{
PANEL_DRAG_HORIZONTAL += e.HorizontalChange;
var baseLeft = -imgImage.Width / 2;
if (PANEL_DRAG_HORIZONTAL > 75) imgImageTranslate.OffsetX = baseLeft + PANEL_DRAG_HORIZONTAL;
else if (PANEL_DRAG_HORIZONTAL < -75) imgImageTranslate.OffsetX = baseLeft + PANEL_DRAG_HORIZONTAL;
else imgImageTranslate.OffsetX = baseLeft;
}
}
}
private void GestureListener_DragStarted(object sender, DragStartedGestureEventArgs e)
{
PANEL_DRAG_HORIZONTAL = 0;
}
What about using a ScrollViewer with horizontal orientation? Of course, you will have to manually detect user actions and implement the proper response (with a couple of properly set Storyboards).
Even a better approach would be writing your own custom control that will view images. A good place to start is this - a CoverFlow control in Silverlight. Once you get the idea how you can bind your image collection to a custom control, all you need is handle user gestures on the currently selected item.

Image gets clipped while changing orientation using Qt

HI all,
I wnt to develop an ImageViewer using qt. I m trying to resize big images by scaling them. My problem is , when i change the screen orientation some part of the image gets clipped and also if i open the image in landscape mode, by default the size of image remains small even when i change back to portrait mode. What am i Doin wrong?
Please help me out. Heres the code dat i hv written
ImageViewer::ImageViewer()
{
setAttribute(Qt::WA_DeleteOnClose);
QAction *back = new QAction(this);
back->setText(QString("Back"));
connect(back,SIGNAL(triggered()),this,SLOT(close()));
back->setSoftKeyRole(QAction::PositiveSoftKey);
addAction(back);
imageLabel = new QLabel();
imageLabel->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);
imageLabel->setAlignment(/*Qt::AlignLeft|*/Qt::AlignCenter);
QWidget *widget = new QWidget;
layout=new QStackedLayout();
layout->addWidget(imageLabel);
widget->setLayout(layout);
setCentralWidget(widget);
}
void ImageViewer::showImage(QString filePath)
{
QImageReader reader;
reader.setFileName(filePath);
QSize imageSize = reader.size();
imageSize.scale(size(), Qt::KeepAspectRatio);
reader.setScaledSize(imageSize);
QImage image = reader.read();
imageLabel->setPixmap(QPixmap::fromImage(image));
imageLabel->adjustSize();
}
You should re-implement QLabel's resizeEvent or install event filter to it and handle QResizeEvent there
The content of showImage method should go to handler of a resize event.
Currently you are using size() of ImageViewer widget (which seems to be derived from QMainWindow), it's better to use imageLabel.size(); or the best QResizeEvent::size() as this will prevent a problem if you will change UI layout in future.

VisualStudio: How to add the dotted border to a UserControl at design time?

i have a user control that descends from UserControl.
When dropped onto the form the user control is invisible, because it doesn't have any kind of border to show itself.
The PictureBox and Panel controls, at design time, draws a dashed 1px border to make it visible.
What is the proper way to do that? Is there an attribute you can use to make VS add that?
There is no property that will do this automatically. However you can archive this by overriding the OnPaint in your control and manually drawing the rectangle.
Inside the overridden event you can call base.OnPaint(e) to draw the controls content and then add use the graphics object to paint the dotted line around the edge.
protected override void OnPaint(PaintEventArgs e)
{
base.OnPaint(e);
if (this.DesignMode)
ControlPaint.DrawBorder( e.Graphics,this.ClientRectangle,Color.Gray,ButtonBorderStyle.Dashed);
}
As you can see you will need to wrap this extra code in an if statement that queries the controls DesignMode property so it only draws in your IDE.
The way that Panel does this (which suggests that this is the actual proper way of doing this) is with the DesignerAttribute. This attribute can be used for design time additions to Control-components as well as non-control components (like Timer).
When using the DesignerAttribute you need to specify a class derived from IDesigner. For a Control designer specifically, you should derive from ControlDesigner.
In your particular implementation of ControlDesigner you want to override the OnPaintAdornment. The purpose of this method is specifically drawing designer hints on top of the control, like a border for example.
Below is the implementation that Panel uses. You could copy that and use it for your control, but you obviously need to adjust the parts that specifically refer to the Panel class.
internal class PanelDesigner : ScrollableControlDesigner
{
protected Pen BorderPen
{
get
{
Color color = ((double)this.Control.BackColor.GetBrightness() < 0.5) ? ControlPaint.Light(this.Control.BackColor) : ControlPaint.Dark(this.Control.BackColor);
return new Pen(color)
{
DashStyle = DashStyle.Dash
};
}
}
public PanelDesigner()
{
base.AutoResizeHandles = true;
}
protected virtual void DrawBorder(Graphics graphics)
{
Panel panel = (Panel)base.Component;
if (panel == null || !panel.Visible)
{
return;
}
Pen borderPen = this.BorderPen;
Rectangle clientRectangle = this.Control.ClientRectangle;
int num = clientRectangle.Width;
clientRectangle.Width = num - 1;
num = clientRectangle.Height;
clientRectangle.Height = num - 1;
graphics.DrawRectangle(borderPen, clientRectangle);
borderPen.Dispose();
}
protected override void OnPaintAdornments(PaintEventArgs pe)
{
Panel panel = (Panel)base.Component;
if (panel.BorderStyle == BorderStyle.None)
{
this.DrawBorder(pe.Graphics);
}
base.OnPaintAdornments(pe);
}
}
ScrollableControlDesigner is a public class that you may or may not want to use as a base for your particular designer implementation.

Resources