黑莓用户界面设计 - 可自定义的UI？

Question

我正在尝试设计一个黑莓应用程序,我想知道是否有任何资源如何创建自定义用户界面元素,皮肤现有的和其他可能性？

我开发了一些带有自定义UI和东西的iPhone应用程序,所以不确定BB世界在UI开发方面提供了什么.

任何提示,建议或想法都会很棒.

Answer 1

黑莓手机没有皮肤,我知道两种方式可以达到皮肤效果

• 创造自己的主题
• 创建自定义控件

创建BlackBerry主题

删除死了Imageshack链接 - BlackBerry Theme Builder

你可以用Theme Builder做什么？它的一些主要功能允许您:

• 自定义BlackBerry应用程序图标
• 更改主屏幕横幅图像和图标/指示灯颜色
• 创建自己的按钮
• 自定义对话框的外观并弹出屏幕
• 自定义待机屏幕
• 自定义菜单和列表的外观
• 自定义电话应用程序屏幕
• 自定义BlackBerry设备上使用的字体

如何创建自己的个人黑莓主题BrileyKenney
bb dev journal - Just Theme It!
黑莓主题和动画图形

坏消息 - 主题应用于整个设备操作系统和每个应用程序
Althought创建的主题可能是一个独立的软件设计产品,我不认为为开发的应用程序创建自己的主题是一个好主意.

设计样机

编程gui可能需要一些时间,如果你想在没有编码的情况下解决GUI规划中的一些问题,你可能想要绘制GUI模型.

您可以使用免费的BlackBerry UI Prototyping Visio Stencils -来自ArtfulBits的v1.0.

删除死了Imageshack链接
删除死图像链接

创建自定义控件

通过创建自定义控件,您可以配置

• 控制尺寸
• 控制形状
• 控制背景(颜色,图像)
• 控制字体(大小,样式,颜色)
• 控制边框(大小,样式,颜色)

所有这些都适用于各州

• 残
• 正常
• 重点
• 活跃(点击)

最后,您可以通过设置背景图像来简单地控制您的控件

基本

devsushi.com:Blackberry JDE API - 用户界面字段参考将基本上给出了现有的黑莓ui控件的概念,包括代码片段和截图.

SO:将项目添加到ListField(BlackBerry)
SO:Blackberry的嵌入式HTML控件？
SO:Blackberry - 如何从DateField获取日期时间值？
SO:将BlackBerry应用程序设计为看起来像iPhone

经理,布局

即使使用标准控件,我们也需要按照我们想要的方式进行布局和分组,因此我们需要自定义管理器:
思考BlackBerry:BlackBerry UI - 创建基本的现场管理器
思考BlackBerry:简单的BlackBerry Grid Layout Manager
思考BlackBerry:自定义屏幕,垂直滚动和更多
SO:Blackberry应用程序中的滚动问题
SO:如何在Blackberry 中将ScrollBar设置为VerticalFieldManager？
无线:为屏幕创建自定义布局管理器
SO:Blackberry - 获取所有子控件字段
SO:取消在布局管理器中滚动
SO:在BlackBerry
SO中创建自定义布局:Blackberry在FullScreen中设置RichtextField的位置
SO:Fun with Field管理员
SO:BlackBerry - 自定义菜单工具栏
SO:BlackBerry - 自定义居中循环Horizo​​ntalFieldManager

自定义控件

关于编写自定义控件的文章集:
思维BlackBerry:BlackBerry UI - 简单的自定义字段
Coderholic:Blackberry自定义按钮字段
无线:为BBStorm
Wireless 创建自己的VirtualKeyboard :带复选框的ListField
CodeProject:创建XY图表/绘图作为BlackBerry Custom字段
SO:黑莓 - 自定义大小EditField
SO:黑莓 - 如何向BasicEditField添加边框？
SO:黑莓 - 设置LabelField背景颜色
SO:黑莓改变水平管理器焦点上子字段的颜色
SO:设置RichTextField的背景和字体颜色,TextField
SO:Blackberry Java:没有插入符号的TextField ？
SO:图像地图式黑莓控制 - CLDC应用程序
SO:黑莓 - 单行B​​asicEditField与大文本
SO:黑莓 - 自定义BubbleChartField
SO:黑莓 - 从列表中选中带复选框的项目
SO:BlackBerry - 创建自定义日期字段
SO:BlackBerry -如何创建子菜单？
所以:黑莓 - 如何用表情符号显示标签？
SO:BlackBerry - 以编程方式显示打字模式指示器

图形,动画

SO:黑莓 - 在屏幕上绘制图像
SO:黑莓 - 背景图像/动画RIM OS 4.5.0
SO:黑莓 - 带动画的加载屏幕
SO:如何在黑莓风暴中设置抗锯齿？
SO:黑莓设置剪辑区域/区域
SO:在BlackBerry中使用Bitmap或EncodedImage更好吗？
SO:Blackberry - 字段布​​局动画

字体

无线:更改BlackBerry应用程序中的
字体开发人员日记:字体
SO:如何为黑莓应用程序创建自定义字体
SO:如何在Blackberry中将字体设置为LabelField文本？
那么:如何让Blackberry UI更具吸引力？
SO:如何动态更改黑莓标签字段的字体颜色？
SO:BlackBerry - Unicode文本显示

Answer 2

Bold 9000上标准媒体应用程序外观的示例

删除死了ImageShack链接 - 切片媒体应用程序

删除死了ImageShack链接 - 切片图像

使用ButtonField的扩展来使用按钮映射图像:

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);
    }
}

• 将Horizo​​ntalFieldManagers放在VerticalFieldManagers中,反之亦然
• 使用不同的图像进行正常,聚焦和活动状态
• 如果你需要一个自定义形状的按钮,你可以在经理paint()方法覆盖中绘制它们,在super.paint()之后

其余部分代码:

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);
    }
}

Answer 3

不幸的是，资源不是很好。最好的信息来源通常是 Google 链接到包含您正在寻找的特定主题的博客。

如果您刚刚开始编写 BB GUI 代码，我强烈建议您了解Manager和Field类，因为您可能需要编写它们的许多自定义扩展。