How to use Async image loader in Dynamic Components by json data

[Prem_Gupta]

Here my json data for dynamic block with dynamic image fetch by airtable

{
    "name": "JsonDemo",
    "metadata-version": 1,
    "author": "",
    "platforms": [
        "Kodular"
    ],
    "extensions": {
        "JSONTools": "com.LukeGackle.JSONTools"
    },
    "keys": [
        "ID",
        "IMG"
    ],
    "components": [{
        "id": "VerticalScrollArrangement1{ID}",
        "type": "VerticalScrollArrangement",
        "properties": {
            "AlignHorizontal": 3,
            "Height": -2,
            "Width": -1095,
            "SmoothScrollingEnabled": true
        },
        "components": [{
            "id": "MaterialCard1{ID}",
            "type": "MaterialCard",
            "properties": {
                "AlignVertical": 2,
                "BackgroundColor": -3617565,
                "CornerRadius": 0,
                "Elevation": 0,
                "FullClickable": true,
                "Height": 75,
                "Width": -2,
                "MarginTop": 10,
                "Radious": 50,
                "RippleColor": -5317,
                "RippleEnabled": false,
                "ShadowColor": -16738680,
                "StrokeColor": -1499549,
                "StrokeWidth": 2
            },
            "components": [{
                "id": "Image1{ID}",
                "type": "Image",
                "properties": {
                    "Height": 64,
                    "Width": 64,
                    "Picture": "{IMG}"
                },
                "components": []
            }]
        }]
    }]
}

Here my block

Pls guide me for write block for async image load, without async, my screen is hold, when my image load then show screen.

[JEWEL (Extension Developer 🧩)]

You may use any image loader extension.
Below one is recommended.

[Paid] Glide - An image loading and caching extension for focused on smooth scrolling

[Paid] Glide - An image loading and caching extension for focused on smooth scrolling [image] Extension Properties Configure the SDK for loading and caching images. [image] Load Set Image component into imageView input. It will show the loaded image into this view. Set image URL into url input. This input also takes image file path. Asset file also supported. This extension also support any dynamic Image components. [image] Clear Memory Cache Use this f…

[Prem_Gupta]

@JEWEL how to set image component or what’s name of image components in schema data

[Gaston (zodiaclogic)]

1. you cannot use numbers in the names of dynamic components (basic logic)

2. having the dictionary available, I don’t understand why they continue using extensions.

try something like this

[Prem_Gupta]

@Gaston

you cannot use numbers in the names of dynamic components (basic logic)

Thank you, its work

@Gaston

having the dictionary available, I don’t understand why they continue using extensions.

What is this, pls guide me, i am not understand, i am new in this field.