Seminar source

トレーニングの準備

プログラムをインポートする

インポートする際は、"update all libraries to the latest revision"を選択します。

Import programRGA_HelloWorld

For Seminar

プログラムの呼び先を変更する

以下のプログラムに該当する行を変更する。

main.cpp line.479

                RGA_Func_Training(frmbuf_info, animation_timing, work_relative_pos);

描画処理の初期状態

以下のプログラムをrga_func.cppに追加する

rga_func.cpp line.263

void RGA_Func_Training(frame_buffer_t* frmbuf_info, int animation_timing, float32_t relative_pos) {
    /* Do accelerated motion from right to left */
    int position = 100;
    r8g8b8a8_t fillColor;
    uint8_t alpha;

    /* Clear */
    canvas2d.clearRect(0, 0, frmbuf_info->width, frmbuf_info->height);
    
    /* programing area 1 ------------------------------------------------*/






    /*---------------------------------------------------------------------*/


    /* 画像の描画 (Section: 6.9.1.29) */
    canvas2d.drawImage(Flower_jpg_File, 0, 0);


    /* programing area 2 ------------------------------------------------*/

    


    /*---------------------------------------------------------------------*/

    
    /* Draw return button */
    canvas2d.drawImage(RetBtn_jpg_File, 640, 10);

    /* Complete drawing */
    R_GRAPHICS_Finish(canvas2d.c_LanguageContext);
}

#ifdef NEVER_COMES_HERE
    /* 画像の描画 (Section: 6.9.1.29) */
    canvas2d.drawImage(g_sample1_jpg_File, 0, 0);
    
    /* 希望する位置への移動 */
    canvas2d.translate(0, 100);

    /* animation */
    /* rotate */
    /* 画像の描画 (Section: 6.9.1.29) */
    canvas2d.drawImage(Flower_jpg_File, 0, 0);

    /* 回転角度 */
    const float32_t  angle = (float32_t)(relative_pos * (3.14159 / 180) * 200);
     
    /* 原点中心で回転処理 */
    canvas2d.rotate(relative_pos * (3.14159 / 180) * 200);

    /* 原点が左上の画像に対して、画像の中心が原点となるように平行移動 */
    canvas2d.translate((-IMG_DRAW_WIDTH / 2), (-IMG_DRAW_HEIGHT / 2));

    /* 希望する位置への移動 */
    canvas2d.translate((100 + (IMG_DRAW_WIDTH / 2)), (100 + (IMG_DRAW_HEIGHT / 2)));

    /* マトリクスの初期化 */
    canvas2d.setTransform(1, 0, 0, 1, 0, 0);

    /* 挿入画像の描画 (Section: 6.9.1.29) */
    canvas2d.drawImage(g_sample1_jpg_File, position, 0);

    /* アニメーション時の位置取得 */
    R_Get_AnimationTimingFunction("ease-in-out", &accelerator);
    position = R_ANIMATION_TIMING_FUNCTION_GetValue(accelerator, relative_pos, 550.0f, 10.0f);

    /* clipping */
    /* クリッピングされた画像の描画 (Section: 6.9.1.29) */ 
    e= R_GRAPHICS_DrawImageChild( graphics, g_sample00_jpg_file, 
                                    0, 0, WVGA_WIDTH - (int_fast32_t)position, WVGA_HEIGHT, 
                                    (int_fast32_t) position, 0, WVGA_WIDTH - (int_fast32_t)position, WVGA_HEIGHT);  IF(e) { goto fin; }
    /* clipping */

    /* alpha blending */

    /* クリア時の背景色の設定 */
    /* 色の指定例:  その他は  http://www.colordic.org/
              赤   緑   青
       白:  255, 255, 255
       黒:    0,   0,   0
       赤:  255,   0,   0
    */
    fillColor.u.Alpha = 255;
    fillColor.u.Red   = 255;
    fillColor.u.Green = 255;
    fillColor.u.Blue  = 255;
    R_GRAPHICS_SetBackgroundColor(canvas2d.c_LanguageContext, fillColor);
    
    /* アルファ値の設定 */
    alpha = (uint8_t) (relative_pos * (float32_t)ACCELERATE_MAX_NUM * 8) + 15;
    R_GRAPHICS_SetGlobalAlpha(canvas2d.c_LanguageContext, alpha);
    /* alpha blending */

#endif

画像を変更する

ImagePackager

  • ImagePackagerで、画像データを簡単にプログラムで使用する形に変更することが可能。
  • ImagaPackagerは、RGAのアプリケーションノートに付属、mbedサイトでも公開しています。
  • Image Packagerのダウンロード
  • 以下の2つの画像をダウンロードします。

ImagePackagerで画像データをプログラム化する

  • ダウンロードしたZIPファイルを任意のフォルダに展開する。
  • 展開した中のimagesフォルダ内のBinaryImageConfig.....xmlファイルをテキストエディタで開く
  • 次のように書き換える(全選択の後、コピーしたデータを貼りつける)

<?xml version="1.0" encoding="UTF-8"?>
<ImagePackager>

<!-- This file is used by RGA_Tools.vbs RunImagePackager in BinaryImageMake.bat -->

<OutputBinary path="BinaryImage_RZ_A1H.c" language="C" symbol="RGA_Sample_BinaryImage"
	source_template="${ImagePackagerLib}\SourceTemplate.xml#default"
	super_class="${ImagePackagerLib}\SuperClass.xml#default"
	alpha_raw_image_width="800">
<OutputHeader path="BinaryImage_RZ_A1H.h" include_define="BINARYIMAGE_RZ_A1H_H"/>
</OutputBinary>


<InputFiles>
<!--Image path="JPEG.jpg" type="graphics_image_t*" symbol="JPEG_jpg_ARGB8888" output_format="ARGB8888"/>
<Image path="JPEG.jpg" type="graphics_image_t*" symbol="JPEG_jpg_RGB565"   output_format="RGB565"/>
<Image path="JPEG.jpg" type="graphics_image_t*" symbol="JPEG_jpg_ARGB1555" output_format="ARGB1555"/>
<Image path="JPEG.jpg" type="graphics_image_t*" symbol="JPEG_jpg_ARGB4444" output_format="ARGB4444"/>
<Image path="JPEG.jpg" type="graphics_image_t*" symbol="JPEG_jpg_YUV422"   output_format="YUV422"/-->

<!-- 演習用データ ここから -->
<File symbol="g_sample0_jpg_File" path="sample00.jpg" type="graphics_image_t*"/>
<File symbol="g_sample1_jpg_File" path="sample01.jpg" type="graphics_image_t*"/>
<!-- 演習用追加データ ここから -->

<File  path="flower.jpg" type="graphics_image_t*" symbol="Flower_jpg_File"/>
<File  path="landscape.jpg" type="graphics_image_t*" symbol="Landscape_jpg_File"/>
<File  path="landscape_wide.jpg" type="graphics_image_t*" symbol="Landscape_wide_jpg_File"/>
<File  path="Top_Screen.jpg" type="graphics_image_t*" symbol="TopScrn_jpg_File"/>
<File  path="ReturnButton.jpg" type="graphics_image_t*" symbol="RetBtn_jpg_File"/>
<File  path="description_swipe.jpg" type="graphics_image_t*" symbol="decs_swipe_jpg_File"/>
<File  path="description_swipe_side.jpg" type="graphics_image_t*" symbol="decs_swipe_side_jpg_File"/>
<File  path="AnimetionTiming.jpg" type="graphics_image_t*" symbol="animetion_timing_jpg_File"/>

<Image path="Crystal.png" type="graphics_image_t*" symbol="Crystal_png_ARGB8888" output_format="ARGB8888"/>
<Image path="Crystal.png" type="graphics_image_t*" symbol="Crystal_png_ARGB1555" output_format="ARGB1555"/>
<Image path="CrystalDither.png" type="graphics_image_t*" symbol="Crystal_png_ARGB4444" output_format="ARGB4444"/>
<File  path="Crystal.png" type="graphics_image_t*" symbol="Crystal_png_File"/>
<File  path="CrystalDither.png" type="graphics_image_t*" symbol="CrystalDither_png_File"/>
</InputFiles>

</ImagePackager>
  • 上の階層にあるBinaryImageMakeRGAH.batを実行し、画像データをソースファイルに変更する
  • 作成できたソースは、Imagesフォルダ内にあります(BinaryImage_RZ_A1H.cとBinaryImage_RZ_A1H.h)
  • これらをテキストエディタで開き、ブラウザ上の同名ファイルの中身を書き換える(全選択+ペースト)

以上で準備完了です。お疲れ様でした


Please log in to post comments.