App:Library:LVGL:docs:Widgets:Image (lv img)

https://docs.lvgl.io/8.2/widgets/core/arc.html

Image (lv_img)

Overview

英文	自動翻訳
Images are the basic object to display images from flash (as arrays) or from files. Images can display symbols (LV_SYMBOL_...) too. Using the Image decoder interface custom image formats can be supported as well.	イメージは、フラッシュからのイメージ（配列として）やファイルからのイメージを表示するための基本的なオブジェクトです。イメージはシンボル(LV_SYMBOL_...) も表示することができます。 イメージデコーダインタフェースを使用すると、カスタムイメージフォーマットもサポートできます。

戻る : Previous

Parts and Styles

英文	自動翻訳
LV_PART_MAIN A background rectangle that uses the typical background style properties and the image itself using the image style properties.	LV_PART_MAIN一般的な背景スタイルのプロパティを使用する背景の長方形と、画像スタイルのプロパティを使用する画像自体。

戻る : Previous

Usage

Image source

英文

自動翻訳

To provide maximum flexibility, the source of the image can be: a variable in code (a C array with the pixels). a file stored externally (e.g. on an SD card). a text with Symbols. To set the source of an image, use lv_img_set_src(img, src). To generate a pixel array from a PNG, JPG or BMP image, use the Online image converter tool and set the converted image with its pointer: lv_img_set_src(img1, &converted_img_var); To make the variable visible in the C file, you need to declare it with LV_IMG_DECLARE(converted_img_var). To use external files, you also need to convert the image files using the online converter tool but now you should select the binary output format. You also need to use LVGL's file system module and register a driver with some functions for the basic file operation. Go to the File system to learn more. To set an image sourced from a file, use lv_img_set_src(img, "S:folder1/my_img.bin"). You can also set a symbol similarly to Labels. In this case, the image will be rendered as text according to the font specified in the style. It enables to use of light-weight monochrome "letters" instead of real images. You can set symbol like lv_img_set_src(img1, LV_SYMBOL_OK).

最大限の柔軟性を提供するために、画像のソースは次のようになります。 コード内の変数（ピクセルを含むC配列）。 外部に保存されたファイル（SDカードなど）。 記号付きのテキスト。 画像のソースを設定するには，lv_img_set_src(img, src)を使用します． PNG、JPG、BMP画像からピクセル配列を生成するには、オンライン画像変換ツールを使い、変換後の画像をそのポインタにセットします： lv_img_set_src(img1, &converted_img_var); Cファイル内で変数を表示するには、 LV_IMG_DECLARE(converted_img_var) で宣言する必要があります． 外部ファイルを使用するには、オンラインコンバータツールを使用して画像ファイルを変換する必要がありますが、ここではバイナリ出力形式を選択する必要があります。また、LVGLのファイルシステムモジュールを使用し、基本的なファイル操作のためのいくつかの関数を持つドライバを登録する必要があります。詳しくは、ファイルシステムへどうぞ。ファイルからソースされた画像を設定するには、lv_img_set_src(img, "S:folder1/my_img.bin") を用います。 また、ラベルと同様にシンボルを設定することもできます。この場合、画像はスタイルで指定されたフォントに従ってテキストとして描画されます。この場合、画像はスタイルで指定されたフォントに従ってテキストとしてレンダリングされ、実際の画像の代わりに軽量のモノクロの「文字」を使用することができます。lv_img_set_src(img1, LV_SYMBOL_OK)のようにシンボルを設定します。

戻る : Previous

Label as an image

英文	自動翻訳
Images and labels are sometimes used to convey the same thing. For example, to describe what a button does. Therefore, images and labels are somewhat interchangeable, that is the images can display texts by using LV_SYMBOL_DUMMY as the prefix of the text. For example, lv_img_set_src(img, LV_SYMBOL_DUMMY "Some text").	画像とラベルは、同じことを伝えるために使われることがあります。例えば、ボタンが何をするものかを説明するためである。つまり、画像は、LV_SYMBOL_DUMMY をテキストの接頭辞として使用することにより、テキストを表示することができるのです。例えば、lv_img_set_src(img, LV_SYMBOL_DUMMY "Some text")とします。

戻る : Previous

Transparency

英文	自動翻訳
The internal (variable) and external images support 2 transparency handling methods: Chroma-keying - Pixels with LV_COLOR_CHROMA_KEY (lv_conf.h) color will be transparent. Alpha byte - An alpha byte is added to every pixel that contains the pixel's opacity	内部（変数）および外部イメージは，2つの透明度処理方法をサポートしています． Chroma-keying - LV_COLOR_CHROMA_KEY (lv_conf.h) の色を持つピクセルは透明になります． Alpha byte - 各ピクセルにアルファバイトが追加され，その中にピクセルの不透明度が含まれます．

戻る : Previous

Palette and Alpha index

英文	自動翻訳
Besides the True color (RGB) color format, the following formats are supported: Indexed - Image has a palette. Alpha indexed - Only alpha values are stored. These options can be selected in the image converter. To learn more about the color formats, read the Images section.	カラーフォーマットは、トゥルーカラー（RGB）以外に、以下のフォーマットをサポートしています。 Indexed - 画像にパレットがあります。 Alpha indexed - アルファ値のみ保存されます。 これらのオプションは、イメージコンバータで選択することができます。 カラーフォーマットについて詳しくは、「画像」のセクションをお読みください。

戻る : Previous

Recolor

英文

自動翻訳

A color can be mixed with every pixel of an image with a given intensity. This can be useful to show different states (checked, inactive, pressed, etc.) of an image without storing more versions of the same image. This feature can be enabled in the style by setting img_recolor_opa between LV_OPA_TRANSP (no recolor, value: 0) and LV_OPA_COVER (full recolor, value: 255). The default value is LV_OPA_TRANSP so this feature is disabled. The color to mix is set by img_recolor.

色は、与えられた強度を持つ画像の各ピクセルと混合することができます。 これは、同じ画像の多くのバージョンを保存することなく、画像の異なる状態（チェック済み、非アクティブ、押された、など）を表示するのに便利である。 この機能は、img_recolor_opa を LV_OPA_TRANSP (再カラーなし、値: 0) と LV_OPA_COVER(フルカラー、値: 255) の間で設定することによりスタイル内で有効にすることができます。 デフォルト値はLV_OPA_TRANSPなので、この機能は無効になっています。 混合する色はimg_recolorで設定します。

戻る : Previous

Auto-size

英文	自動翻訳
If the width or height of the image object is set to LV_SIZE_CONTENT the object's size will be set according to the size of the image source in the respective direction.	画像オブジェクトの幅または高さがLV_SIZE_CONTENTに設定されている場合、オブジェクトのサイズは画像ソースの各方向のサイズに応じて設定されます。

戻る : Previous

Mosaic

英文	自動翻訳
If the object's size is greater than the image size in any directions, then the image will be repeated like a mosaic. This allows creation a large image from only a very narrow source. For example, you can have a 300 x 5 image with a special gradient and set it as a wallpaper using the mosaic feature.	被写体の大きさが画像サイズより大きい方向があれば、モザイクのように画像が繰り返されます。 これにより、ごく狭い範囲から大きな画像を作ることができます。 例えば、300×5の画像に特殊なグラデーションをかけて、モザイク機能を使って壁紙に設定することができます。

戻る : Previous

Offset

英文	自動翻訳
With lv_img_set_offset_x(img, x_ofs) and lv_img_set_offset_y(img, y_ofs), you can add some offset to the displayed image. Useful if the object size is smaller than the image source size. Using the offset parameter a Texture atlas or a "running image" effect can be created by Animating the x or y offset.	lv_img_set_offset_x(img, x_ofs) とlv_img_set_offset_y(img, y_ofs)で、表示画像にオフセットをかけることができます。 オブジェクトのサイズが画像ソースのサイズより小さい場合に便利です。 offset パラメータを使用すると、x または y オフセットをアニメーション化することによって、Texture atlas や "running image" エフェクトを作成することができます。

戻る : Previous

Transformations

英文

自動翻訳

Using the lv_img_set_zoom(img, factor) the images will be zoomed. Set factor to 256 or LV_IMG_ZOOM_NONE to disable zooming. A larger value enlarges the images (e.g. 512 double size), a smaller value shrinks it (e.g. 128 half size). Fractional scale works as well. E.g. 281 for 10% enlargement. To rotate the image use lv_img_set_angle(img, angle). Angle has 0.1 degree precision, so for 45.8° set 458. The transform_zoom and transform_angle style properties are also used to determine the final zoom and angle. By default, the pivot point of the rotation is the center of the image. It can be changed with lv_img_set_pivot(img, pivot_x, pivot_y). 0;0 is the top left corner. The quality of the transformation can be adjusted with lv_img_set_antialias(img, true/false). With enabled anti-aliasing the transformations are higher quality but slower. The transformations require the whole image to be available. Therefore indexed images (LV_IMG_CF_INDEXED_...), alpha only images (LV_IMG_CF_ALPHA_...) or images from files can not be transformed. In other words transformations work only on true color images stored as C array, or if a custom Image decoder returns the whole image. Note that the real coordinates of image objects won't change during transformation. That is lv_obj_get_width/height/x/y() will return the original, non-zoomed coordinates.

lv_img_set_zoom(img, factor) を使用すると、画像がズームされる。factorに256を指定するか、LV_IMG_ZOOM_NONEを指定するとズームが無効になります。 値が大きいと画像は拡大され（例：512は2倍のサイズ）、小さいと縮小される（例：128はハーフサイズ）。 分数倍率も有効です。例：281 で10%拡大。 画像を回転させるには、lv_img_set_angle(img, angle)を使用します。 角度の精度は0.1度なので、45.8度なら458を設定します。 transform_zoom と transform_angle スタイルプロパティは、最終的なズームと角度を決定するためにも使用されます。 デフォルトでは、回転の支点は画像の中心である。 lv_img_set_pivot(img, pivot_x, pivot_y)で変更可能です。0;0は左上隅です。 変換の品質は lv_img_set_antialias(img, true/false) で調整することができます。アンチエイリアスを有効にすると、変換の品質は高くなりますが、処理速度は遅くなります。 変換を行うには，画像全体が利用可能であることが必要です．したがって，インデックス付き画像 (LV_IMG_CF_INDEXED_...) やアルファ専用画像 (LV_IMG_CF_ALPHA_...) ，ファイル内の画像は，変換することができない． 言い換えると，変換は，C言語の配列として保存されたトゥルーカラー画像，あるいはカスタム画像デコーダが画像全体を返す場合のみ動作します． 画像オブジェクトの実座標は，変換中に変化しないことに注意してください．つまり、 lv_obj_get_width/height/x/y() は、ズームされていない元の座標を返します。

戻る : Previous

Size mode

英文

自動翻訳

By default, when the image is zoomed or rotated the real coordinates of the image object are not changed. The larger content simply overflows the object's boundaries. It also means the layouts are not affected the by the transformations. If you need the object size to be updated to the transformed size set lv_img_set_size_mode(img, LV_IMG_SIZE_MODE_REAL). (The previous mode is the default and called LV_IMG_SIZE_MODE_VIRTUAL). In this case if the width/height of the object is set to LV_SIZE_CONTENT the object's size will be set to the zoomed and rotated size. If an explicit size is set then the overflowing content will be cropped.

デフォルトでは、画像をズームしたり回転させたりしても、画像オブジェクトの実座標は変更されない。 より大きなコンテンツは、単にオブジェクトの境界をオーバーフローするだけです。 これは、レイアウトが変換の影響を受けないことも意味します。 オブジェクトのサイズを変換後のサイズに更新したい場合は、 lv_img_set_size_mode(img, LV_IMG_SIZE_MODE_REAL)をセットしてください。 (前のモードはデフォルトで、LV_IMG_SIZE_MODE_VIRTUALと呼ばれます）。 この場合、オブジェクトのwidth/heightがLV_SIZE_CONTENT に設定されると、オブジェクトのサイズはズームと回転されたサイズに設定されます。 明示的なサイズが設定されている場合、はみ出したコンテンツは切り取られます。

戻る : Previous

Rounded image

英文	自動翻訳
You can use lv_obj_set_style_radius to set radius to an image, and enable lv_obj_set_style_clip_corner to clip the content to rounded rectangle or circular shape. Please note this will have some negative performance impact to CPU based renderers.	lv_obj_set_style_radius を使用して画像に半径を設定し、 lv_obj_set_style_clip_corner を有効にしてコンテンツを丸い矩形または円形にクリップすることができます。 これは、CPUベースのレンダラーにいくつかの負のパフォーマンスの影響を与えることに注意してください。

戻る : Previous

Events

英文	自動翻訳
No special events are sent by image objects. See the events of the Base object too. Learn more about Events.	イメージオブジェクトによって送信される特別なイベントはありません。 Baseオブジェクトのイベントも参照してください。 イベントの詳細を確認してください。

:戻る : Previous

Keys

英文	自動翻訳
No Keys are processed by the object type. Learn more about Keys.	オブジェクトタイプによって処理されるキーはありません。 キーの詳細を確認してください。

戻る : Previous

Example

英文	自動翻訳
Image from variable and symbol
Image recoloring
Rotate and zoom
Image offset and styling

戻る : Previous

API

英文

自動翻訳

Typedefs typedef uint8_t lv_img_size_mode_t Enums enum [anonymous] Image size mode, when image size and object size is different Values: enumerator LV_IMG_SIZE_MODE_VIRTUAL Zoom doesn't affect the coordinates of the object, however if zoomed in the image is drawn out of the its coordinates. The layout's won't change on zoom enumerator LV_IMG_SIZE_MODE_REAL If the object size is set to SIZE_CONTENT, then object size equals zoomed image size. It causes layout recalculation. If the object size is set explicitly, the image will be cropped when zoomed in. Functions lv_obj_t *lv_img_create(lv_obj_t *parent) Create an image object Parameters parent -- pointer to an object, it will be the parent of the new image Returns pointer to the created image void lv_img_set_src(lv_obj_t *obj, const void *src) Set the image data to display on the object Parameters obj -- pointer to an image object src_img -- 1) pointer to an lv_img_dsc_t descriptor (converted by LVGL's image converter) (e.g. &my_img) or 2) path to an image file (e.g. "S:/dir/img.bin")or 3) a SYMBOL (e.g. LV_SYMBOL_OK) void lv_img_set_offset_x(lv_obj_t *obj, lv_coord_t x) Set an offset for the source of an image so the image will be displayed from the new origin. Parameters obj -- pointer to an image x -- the new offset along x axis. void lv_img_set_offset_y(lv_obj_t *obj, lv_coord_t y) Set an offset for the source of an image. so the image will be displayed from the new origin. Parameters obj -- pointer to an image y -- the new offset along y axis. void lv_img_set_angle(lv_obj_t *obj, int16_t angle) Set the rotation angle of the image. The image will be rotated around the set pivot set by lv_img_set_pivot() Parameters obj -- pointer to an image object angle -- rotation angle in degree with 0.1 degree resolution (0..3600: clock wise) void lv_img_set_pivot(lv_obj_t *obj, lv_coord_t x, lv_coord_t y) Set the rotation center of the image. The image will be rotated around this point Parameters obj -- pointer to an image object x -- rotation center x of the image y -- rotation center y of the image void lv_img_set_zoom(lv_obj_t *obj, uint16_t zoom) void lv_img_set_antialias(lv_obj_t *obj, bool antialias) Enable/disable anti-aliasing for the transformations (rotate, zoom) or not. The quality is better with anti-aliasing looks better but slower. Parameters obj -- pointer to an image object antialias -- true: anti-aliased; false: not anti-aliased void lv_img_set_size_mode(lv_obj_t *obj, lv_img_size_mode_t mode) Set the image object size mode. Parameters obj -- pointer to an image object mode -- the new size mode. const void *lv_img_get_src(lv_obj_t *obj) Get the source of the image Parameters obj -- pointer to an image object Returns the image source (symbol, file name or ::lv-img_dsc_t for C arrays) lv_coord_t lv_img_get_offset_x(lv_obj_t *obj) Get the offset's x attribute of the image object. Parameters img -- pointer to an image Returns offset X value. lv_coord_t lv_img_get_offset_y(lv_obj_t *obj) Get the offset's y attribute of the image object. Parameters obj -- pointer to an image Returns offset Y value. uint16_t lv_img_get_angle(lv_obj_t *obj) Get the rotation angle of the image. Parameters obj -- pointer to an image object Returns rotation angle in 0.1 degrees (0..3600) void lv_img_get_pivot(lv_obj_t *obj, lv_point_t *pivot) Get the pivot (rotation center) of the image. Parameters img -- pointer to an image object pivot -- store the rotation center here uint16_t lv_img_get_zoom(lv_obj_t *obj) Get the zoom factor of the image. Parameters obj -- pointer to an image object Returns zoom factor (256: no zoom) bool lv_img_get_antialias(lv_obj_t *obj) Get whether the transformations (rotate, zoom) are anti-aliased or not Parameters obj -- pointer to an image object Returns true: anti-aliased; false: not anti-aliased lv_img_size_mode_t lv_img_get_size_mode(lv_obj_t *obj) Get the size mode of the image Parameters obj -- pointer to an image object Returns element of lv_img_size_mode_t Variables const lv_obj_class_t lv_img_class struct lv_img_t #i'nclude <l'v_img.h> Data of image Public Members lv_obj_t obj const void *src lv_point_t offset lv_coord_t w lv_coord_t h uint16_t angle lv_point_t pivot uint16_t zoom uint8_t src_type uint8_t cf uint8_t antialias uint8_t obj_size_mode

Typedef typedef uint8_t lv_img_size_mode_t 列挙型 列挙型[匿名] 画像サイズとオブジェクトサイズが異なる場合の画像サイズモード 値： 列挙子LV_IMG_SIZE_MODE_VIRTUAL ズームはオブジェクトの座標には影響しませんが、ズームインすると画像はその座標から描画されます。ズームしてもレイアウトは変わりません 列挙子LV_IMG_SIZE_MODE_REAL オブジェクトサイズがSIZE_CONTENTに設定されている場合、オブジェクトサイズはズームされた画像サイズと等しくなります。レイアウトの再計算が発生します。オブジェクトサイズが明示的に設定されている場合、ズームインすると画像がトリミングされます。 機能 lv_obj_t * lv_img_create（lv_obj_t * parent） 画像オブジェクトを作成する パラメーター parent-オブジェクトへのポインタ。新しい画像の親になります 戻り値 作成された画像へのポインタ void lv_img_set_src（lv_obj_t * obj、const void * src） オブジェクトに表示する画像データを設定します パラメーター obj-画像オブジェクトへのポインタ src_img-1）lv_img_dsc_t記述子へのポインター（LVGLのイメージコンバーターによって変換される）（例：＆my_img）または2）イメージファイルへのパス（例： "S：/dir/img.bin"）または3）SYMBOL（例：LV_SYMBOL_OK ）。 void lv_img_set_offset_x（lv_obj_t * obj、lv_coord_t x） 画像が新しい原点から表示されるように、画像のソースのオフセットを設定します。 パラメーター obj-画像へのポインタ x-x軸に沿った新しいオフセット。 void lv_img_set_offset_y（lv_obj_t * obj、lv_coord_t y） 画像のソースのオフセットを設定します。そのため、画像は新しい原点から表示されます。 パラメーター obj-画像へのポインタ y-y軸に沿った新しいオフセット。 void lv_img_set_angle（lv_obj_t * obj、int16_t angle） 画像の回転角を設定します。画像は、によって設定されたピボットを中心に回転しますlv_img_set_pivot() パラメーター obj-画像オブジェクトへのポインタ 角度-0.1度の分解能での回転角（0..3600：時計回り） void lv_img_set_pivot（lv_obj_t * obj、lv_coord_t x、lv_coord_t y） 画像の回転中心を設定します。この点を中心に画像が回転します パラメーター obj-画像オブジェクトへのポインタ x-画像の回転中心x y-画像の回転中心y void lv_img_set_zoom（lv_obj_t * obj、uint16_tズーム） void lv_img_set_antialias（lv_obj_t * obj、bool antialias） 変換（回転、ズーム）のアンチエイリアシングを有効/無効にします。アンチエイリアシングの方が見栄えは良くなりますが、速度は遅くなります。 パラメーター obj-画像オブジェクトへのポインタ アンチエイリアス-true：アンチエイリアス; false：アンチエイリアスされていません void lv_img_set_size_mode（lv_obj_t * obj、lv_img_size_mode_t mode） 画像オブジェクトサイズモードを設定します。 パラメーター obj-画像オブジェクトへのポインタ mode-新しいサイズモード。 const void * lv_img_get_src（lv_obj_t * obj） 画像のソースを取得する パラメーター obj-画像オブジェクトへのポインタ 戻り値 画像ソース（シンボル、ファイル名、またはCアレイの場合は:: lv-img_dsc_t） lv_coord_t lv_img_get_offset_x（lv_obj_t * obj） 画像オブジェクトのオフセットのx属性を取得します。 パラメーター img-画像へのポインタ 戻り値 オフセットX値。 lv_coord_t lv_img_get_offset_y（lv_obj_t * obj） 画像オブジェクトのオフセットのy属性を取得します。 パラメーター obj-画像へのポインタ 戻り値 オフセットY値。 uint16_t lv_img_get_angle（lv_obj_t * obj） 画像の回転角を取得します。 パラメーター obj-画像オブジェクトへのポインタ 戻り値 0.1度の回転角（0..3600） void lv_img_get_pivot（lv_obj_t * obj、lv_point_t *ivot） 画像のピボット（回転中心）を取得します。 パラメーター img-画像オブジェクトへのポインタ ピボット-ここに回転中心を格納します uint16_t lv_img_get_zoom（lv_obj_t * obj） 画像のズーム率を取得します。 パラメーター obj-画像オブジェクトへのポインタ 戻り値 ズーム率（256：ズームなし） bool lv_img_get_antialias（lv_obj_t * obj） 変換（回転、ズーム）がアンチエイリアス処理されているかどうかを確認します パラメーター obj-画像オブジェクトへのポインタ 戻り値 true：アンチエイリアス; false：アンチエイリアスされていません lv_img_size_mode_t lv_img_get_size_mode（lv_obj_t * obj） 画像のサイズモードを取得する パラメーター obj-画像オブジェクトへのポインタ 戻り値 lv_img_size_mode_tの要素 変数 const lv_obj_class_t lv_img_class struct lv_img_t # i'nclude<l' v_img.h>画像公開メンバーのデータ lv_obj_t obj const void * src lv_point_tオフセット lv_coord_t w lv_coord_t h uint16_t角度 lv_point_tピボット uint16_tズーム uint8_t src_type uint8_t cf. uint8_tアンチエイリアス uint8_t obj_size_mode

戻る : Previous