Dynamic Page Response
---

We can use most of the [built-in widgets](https://pub.dev/packages/json_dynamic_widget#built-in-widgets) ([usage examples](https://peiffer-innovations.github.io/json_dynamic_widget/web/index.html)) in Flutter into our backend response. Also, we can write our [custom widget builders](https://hackmd.io/4U1hPHrsS628lenln4AHyQ) too. Here is the example response model:

{
  "type": "padding",
  "args": {
    "padding": {
      "left": 32,
      "right": 32
    },
    "child": {
      "type": "column",
      "args": {
        "children": [
          {
            "type": "otp_title_widget",
            "args": {
              "title": "Şifre Doğrulama"
            }
          },
          {
            "type": "otp_message_widget",
            "args": {
              "message": "Lütfen 5** ** 45 ile biten cep telefonunuza gelen doğrulama kodunu giriniz."
            }
          },
          {
            "type": "otp_count_down_timer_widget",
            "args": {
              "duration": 120
            }
          },
          {
            "type": "otp_input_with_submit_button_widget",
            "args": {
              "title": "SMS Doğrulama Kodu",
              "button_text": "Devam",
              "otp_length": 6,
              "workflow": "login",
              "transition_id": "send-push-login-flow"
            }
          },
          {
            "type": "spacer"
          },
          {
            "type": "security_icon_widget",
            "args": {
              "paddingAll": 32
            }
          }
        ]
      }
    }
  }
}


As we can see; padding and column widgets are built-in widgets; however otp_title_widget, otp_message_widget, otp_count_down_timer_widget, otp_input_with_submit_button_widget, spacer and security_icon_widget are custom widgets defined by ourselves.

> Note that, we could use built-in text widget by passing additional style parameters instead of otp_title_widget and otp_message_widget; but custom widgets makes responses shorter.