一、界面布局以及资源添加
; Q# v% `9 J  _! _" v( q* e" H1、添加图片和文字资源

1. 将需要的图片资源拷贝到工程目录下  .xxx\..\assets\images的目录下面。
   5 d$ j# v- f2 k3 d6 M* f4 ?3 l1 ^' ?; p
2. image文件夹是专门存放工程图片的。也可以在touchgfx界面中添加，
   - u6 F  \8 C/ c9 y
3. 方法另行百度。加完后如下所示：

复制代码

2 B9 Q* k- T/ f! J% I$ ?% ]0 s4 @

1.         下图是添加文字资源

复制代码

7 Q( k$ a7 M- a6 N: d3 _3 S
" i8 o0 ]2 i+ `. g3 m
4 T1 @8 ~& E* d2 y- m2、创建自定义控件

1. 如下图创建自定义控件

复制代码

4 ~0 {3 Z5 i* a3 f& b' r5 ]3、创建主界面
/ B" V9 R( ^' p% G/ r; O# u

1. 如下图创建主界面

复制代码

! [* g% ^. W$ {  c+ p. E" z
/ o& I% z: ?; k4 q# w
二、功能实现
1、引入文本和bitmap头文件
9 {. b( U9 b, h$ _3 g

1. #include <BitmapDatabase.hpp>
   
2. #include <texts/TextKeysAndLanguages.hpp>

复制代码

: r0 {, k, W  X8 d) c2、自定义控件添加文本和bitmap方法实现

1. 先在自定义控件类中加上文本和图片图片添加方法，注意头文件的引用。

复制代码

8 \1 q4 \2 ?8 f7 p6 }

1. 然后在.c文件中实现上面声明的方法

复制代码

1. void CustomContainer1::setImageandText(const Bitmap & bitmap, TEXTS iconText)
   5 c( Q. A2 D+ n2 n0 ?# B, _) C
2. {
   
3.         image1.setBitmap(Bitmap(bitmap));
   % g) ?  ^/ c. j( I8 T; V, e: _* P- O7 ~
4.         textArea1.setTypedText(TypedText(iconText));
   
5.         textArea1.resizeToCurrentText();
   4 L  g' P& S8 H0 p. }: j: b& H
6. 
   , }- c3 B" R- a) b
7. }

复制代码

void CustomContainer1::setImageandText(const Bitmap & bitmap, TEXTS

3、主界面的构造函数中添加界面初始化代码
% |" x: e/ ]& U* ?; N" z

1.         先在类中添加CustomContainer自定义控件数组

复制代码

0 l0 {6 v' x9 J/ S
  x! `) v: L! [! j, \7 n

1. 然后，再在主界面的构造函数中对每一个自定义控件添加图片和文字

复制代码

9 Y: ?6 _2 N- A: }$ G
% ~) n! |& ?( q/ d; c6 y