Using Alerts

Notify your user about errors or finished tasks with Alerts.
showing an alert as popup

Design

The above design has been realized with following CSS code:

.mailForm {
	padding: 5;
	padding-left: 5;
	padding-right: 5;
	background-color: black;
	layout: horizontal-expand | horizontal-center | top;
	//#if !polish.useScrollBar
		scrollindicator-up-image: url( arrowUp.png );
		scrollindicator-down-image: url( arrowDown.png );
	//#endif
	//#if polish.midp2
		screen-change-animation: fade;
	//#endif
	//#if polish.api.mmapi
		title-style: .mailFormTitle;
	//#endif
}

.mailAlert extends .mailForm {
	title-style: none;
	margin-right: 10;
	margin-left: 10;
	padding-left: 5;
	padding-right: 5;
	layout: horizontal-center | bottom | horizontal-shrink | vertical-shrink;
	repaint-previous-screen: true;
	//#if polish.midp2 || polish.api.nokia-ui
		border {
			type: drop-shadow;
			width: 6;
			inner-color: #aff0;
			outer-color: #2002;
			orientation: top-right;
		}
	//#endif
	//#if polish.midp2
		screen-change-animation: fade;
	//#endif
	background-color: green;
}

alertcontent {
	font-color: white;
}

Alert CSS Attributes

You can use the following CSS attributes for the Alert:

CSS Attribute	Default	Values	Explanation
content-style	-	style	The style for the text of an alert.
show-dismiss-command	true	true, false	Can be used to deactivate the default Alert.DISMISS command for Alerts that don't have an Alert.FOREVER timeout.
Further CSS Attribute	Default	Values	Explanation
always-include	false	true, false	Defines if a style should always be included, even if not used.
background	-	background definition	The background of an item or screen. The default background for items is "none", the default background for screens is a simple white background.
background-bottom	-	bottom, menubar	The bottom border of the background for this screen. Usually the background reaches to the very bottom of the screen which includes the menubar. By setting background-bottom: menubar; this background only reaches to the menubar.
background-top	-	top, title	The top border of the background for this screen. Usually the background reaches from the very top of the screen which includes the title. By setting background-top: title; this background starts after the title.
clip-screen-info	false	true, false	Enables or disables the clipping of the info-section. It is visible for TextFields in the direct input mode, for example.
columns	1	integer	The number of columns. This can be used to layout the items in a table.
complete-border	-	border	A border reference from the borders section. The border includes the label of the item and is independent of the item's normal border.
complete-background	-	background	A background name from the backgrounds section. The background includes the label of the item and is independent of the item's normal background.
border	-	border definition	The border of an item or screen. The default border is "none".
columns-width	normal	columns-width	Either "normal", "equal" or the width for each column in a comma separated list (e.g. "columns-width: 60,60,10").
expand-items	false	true, false	Expands the items within a screen or container to the width of the largest item - in contrast to the expand layout not the full available width is being used.
focused-style	focused	style	The name of the style for the currently focused item, usually applied with a [style-name]:hover construct.
focused-style-first	-	style	The focused style for the first item in an Screen, ChoiceGroup, List, Container.
focused-style-last	-	style	The focused style for the last item in an Screen, ChoiceGroup, List, Container.
foreground-image	-	imageurl	The url of the image that should be shown at the topmost layer. You can also set the foreground-x and foreground-y positions.
foreground-x	-	integer	The x position of the foreground image.
foreground-y	-	integer	The y position of the foreground image.
inherit	true	true, false	Defines if a style that extends this style should inherit all attributes.
menubar-color	-	color	The color of the menu-bar. This overrides the settings in the predefined style "menu". This attribute is only used, when the "menu" fullscreen setting is activated in the "build.xml" file.
menubar-style	menubar	style	The name of the style for the menubar of the corresponding Screen.
table-selected-background	-	background	The background for selected cells of a table.
repaint-previous-screen	false	true, false	Specifies whether the previous screen should be repainted whenever the current screen changes, i.e. by user interaction. This makes sense when a translucent background is used for the current screen and the screen contains modifiable or selectable items.
screen-change-animation	-		An effect that should be shown whenever the screen is changed.
screen-orientation-change-animation	-	screen-change-animation	Defines the animation that should be shown when the screen orientation is changed. Orientation changes need to be allowed by setting the preprocessing variable ScreenOrientationCanChangeManually to true.
scroll-mode	smooth	normal, smooth	Enables or disables the smooth scrolling function.
scrollbar-slider-color	black	color	The color of the slider, is ignored when a slider-image is defined.
scrollbar-slider-down-image	-	imageurl	The image used for signaling that the user can scroll downwards. By default nothing is painted.
scrollbar-slider-image-repeat	false	true, false	Either "true" or "false". When "true" is given, the slider image is repeated vertically, if necessary.
scrollbar-slider-mode	page	area, item, page	The mode of the slider, either "area", "item" or "page". In the "area" mode the slider represents the position of the current selection relative to the complete width and height. In the "item" mode the index of the currently selected item is taken into account relative to the number of items. In the "page" mode the height of the currently visible area will be set relative to the complete height of the screen. The default mode is "page".
scrollbar-slider-up-image	-	imageurl	The image used for signaling that the user can scroll upwards. By default nothing is painted.
scrollbar-slider-width	2	integer	The width of the slider in pixels, is ignored when a slider-image is defined.
scrollindicator-color	black	color	The color of the item which indicates that the user can scroll the current screen. Is ignored when a scrollbar is used.
scrollindicator-up-image	-	imageurl	The URL of the image indicating that the user can scroll upwards.
table-selected-row-background	-	background	The background for selected rows of a table.
scrollbar-slider-image	-	imageurl	The URL of image used for the slider.
scrollbar-style	scrollbar	style	The name of the style for the scrollbar of the corresponding Screen.
show-scrollbar	true	true, false	Can be used to deactivate the scrollbar for a specific screen. You need to activate scrollbar usage with polish.useScrollBar=true before using this CSS attribute.
table-selected-column-background	-	background	The background for selected columns of a table.
scrollindicator-down-image	-	imageurl	The URL of the image indicating that the user can scroll downwards.
separate-menu	true	true, false	Ensures that the menu is painted at the bottom of the screen without using the margins of the screen. You can apply the screen margins to the menubar as well by setting the "separate-menubar" property to "true".
ticker-position	top	top, bottom	You can specify the position of the ticker on the screen.
title-position	top	top, bottom	You can specify the position of the title on the screen.
title-style	title	style	The name of the style for the title of the corresponding Screen.
view-type	-	coverflow, dropping, fisheye, grayout, midp2, numbered, shuffle, verticalfixed	Defines another visualization for an Item or a Screen.
view-type-sequential-traversal	false	true, false	Defines if the cells of a table can only be traversered in sequential order. By default you can move to the next row by pressing down - when the sequential-traversal is enabled pressing down will move the focus to the next item instead. Only applicable when the columns attribute is being used.

alertcontent CSS Attributes

Use the predefined style alertcontent for designing the text and optional image of the alert or select a custom style using the content-style CSS attribute.
You can use all settings that are available for the IconCustomItem for the Alert's content as well:

CSS Attribute	Default	Values	Explanation
icon-horizontal-adjustment	0	integer	Adjusts the icon by the specified number of pixels horizontally. Negative values move the icon-image to the left.
icon-image	none	imageurl	The URL of the image. The keyword %INDEX% can be used for adding the position of the icon to the name, e.g."icon-image: url(icon%INDEX%.png);".
icon-image-align	left	left, right, top, bottom, center	The position of the image relative to the text.
icon-image-align-next	false	true, false	Specifies if a horizontal aligned image should be painted at the border (=default) or next to the content when the item has an expand layout.
icon-inactive	false	true, false	Can be used to deactivate a specific ChoiceGroup/List item permanently. This can be useful to integrate explanations, headings etc into an ChoiceGroup/List.
icon-padding	1	integer	The padding between the image and the text of an icon.
icon-vertical-adjustment	0	integer	Adjusts the icon by the specified number of pixels vertically. Negative values move the icon-image to the top.
scale-factor	-	integer	The factor in percent by which the image should be scaled, e.g. 200.
scale-steps	5	integer	The number of intermediate steps that should be used for scaling an image.
text-effect	-		Sets a text effect.
text-horizontal-adjustment	0	integer	Adjusts the text by the specified number of pixels horizontally. Negative values move the text to the left.
text-vertical-adjustment	0	integer	Adjusts the text by the specified number of pixels vertically. Negative values move the text to the top.
Further CSS Attribute	Default	Values	Explanation
after	-	imageurl	The URL of the image that should be shown after the item in question.
always-include	false	true, false	Defines if a style should always be included, even if not used.
background	-	background definition	The background of an item or screen. The default background for items is "none", the default background for screens is a simple white background.
before	-	imageurl	The URL of the image that should be shown before the item in question.
complete-background	-	background	A background name from the backgrounds section. The background includes the label of the item and is independent of the item's normal background.
border	-	border definition	The border of an item or screen. The default border is "none".
complete-background-padding	-	integer	The padding that is added to the complete-background and/or complete-border. Note that this does not change the size of the item, so you might need to adapt margins or normal paddings for your design.
focused-style	focused	style	The name of the style for the currently focused item, usually applied with a [style-name]:hover construct.
inherit	true	true, false	Defines if a style that extends this style should inherit all attributes.
label-style	label	style	The name of the style for the label of the corresponding Item.
min-height	-	integer	The minimum height of an item.
min-width	-	integer	The minimum width of an item.
table-selected-background	-	background	The background for selected cells of a table.
colspan	1	integer	The number of columns wich are used by the item within a table.
table-selected-row-background	-	background	The background for selected rows of a table.
complete-border	-	border	A border reference from the borders section. The border includes the label of the item and is independent of the item's normal border.
font-bitmap	-	string	Defines which bitmap (bmf) font should be used.
include-label	false	true, false	Usually the label of an item is rendered separately of the item's content. You can expand the background and border over the label as well using this attribute.
max-height	-	integer	The maximum height of an item.
max-width	-	integer	The maximum width of an item.
opacity	255	integer	The opacity of an item between 0 (fully transparent) and 255 (fully opaque).
pressed-style	-	style	The style which indicates that an item is being pressed, usually applied with a [style-name]:pressed construct.
table-selected-column-background	-	background	The background for selected columns of a table.
text-wrap	true	true, false	Determines wether the text should be wrapped or whether it should be kept on a single line, even when it is larger than the available width.
text-wrap-animate	true	true, false	You can deactivate animations for texts that should not be wrapped and which are too long for a single line.
text-wrap-animation-direction	both	both, left, right	The direction of the animation when the text is too wide and wrapping is deactivated.
text-wrap-animation-speed	1	integer	The speed of the animation when the text is too wide and wrapping is deactivated.
view-type	-	fade-in, fade-out, particle, size-decrease, size-increase	Defines another visualization for an Item or a Screen.
visible	true	true, false	Toggles the visibility of an item. When an item is invisible, it will not occupy any space.
x-adjust	0	integer	The horizontal position adjustment.

Programming

Use a javax.microedition.lcdui.Alert as you would normally in your application and use UiAccess for using J2ME Polish specific functionalities like:

setStyle( Alert alert ): Sets a style in conjuntion with a style preprocessing directive.
setStyle( Alert alert, Style style ): Sets a style programmatically.

Configuration

You translate the default dismiss command of an Alert without timeout using the variables section of your build.xml script or the messages.txt file. Refer to the localization documentation for more details on this.

# sets the text of an Alert's dismiss command (default=OK):
polish.command.ok=Done