mirror of
https://github.com/divkit/divkit.git
synced 2026-05-07 20:02:32 +00:00
Lessons resources
commit_hash:39fa333110b40aaf54822cd059ba234934e82055
This commit is contained in:
@@ -12272,12 +12272,17 @@
|
||||
"client/android/sample/src/main/AndroidManifest.xml":"divkit/public/client/android/sample/src/main/AndroidManifest.xml",
|
||||
"client/android/sample/src/main/assets/sample.json":"divkit/public/client/android/sample/src/main/assets/sample.json",
|
||||
"client/android/sample/src/main/ic_launcher-playstore.png":"divkit/public/client/android/sample/src/main/ic_launcher-playstore.png",
|
||||
"client/android/sample/src/main/java/com/yandex/divkit/sample/ArtikaTypefaceProvider.kt":"divkit/public/client/android/sample/src/main/java/com/yandex/divkit/sample/ArtikaTypefaceProvider.kt",
|
||||
"client/android/sample/src/main/java/com/yandex/divkit/sample/AssetReader.kt":"divkit/public/client/android/sample/src/main/java/com/yandex/divkit/sample/AssetReader.kt",
|
||||
"client/android/sample/src/main/java/com/yandex/divkit/sample/DivViewFactory.kt":"divkit/public/client/android/sample/src/main/java/com/yandex/divkit/sample/DivViewFactory.kt",
|
||||
"client/android/sample/src/main/java/com/yandex/divkit/sample/MainPageActivity.kt":"divkit/public/client/android/sample/src/main/java/com/yandex/divkit/sample/MainPageActivity.kt",
|
||||
"client/android/sample/src/main/java/com/yandex/divkit/sample/MultiTypefaceProvider.kt":"divkit/public/client/android/sample/src/main/java/com/yandex/divkit/sample/MultiTypefaceProvider.kt",
|
||||
"client/android/sample/src/main/java/com/yandex/divkit/sample/SampleDivActionHandler.kt":"divkit/public/client/android/sample/src/main/java/com/yandex/divkit/sample/SampleDivActionHandler.kt",
|
||||
"client/android/sample/src/main/java/com/yandex/divkit/sample/SuperTriviaTypefaceProvider.kt":"divkit/public/client/android/sample/src/main/java/com/yandex/divkit/sample/SuperTriviaTypefaceProvider.kt",
|
||||
"client/android/sample/src/main/res/drawable/ic_launcher_background.xml":"divkit/public/client/android/sample/src/main/res/drawable/ic_launcher_background.xml",
|
||||
"client/android/sample/src/main/res/drawable/ic_launcher_foreground.xml":"divkit/public/client/android/sample/src/main/res/drawable/ic_launcher_foreground.xml",
|
||||
"client/android/sample/src/main/res/font/artika.ttf":"divkit/public/client/android/sample/src/main/res/font/artika.ttf",
|
||||
"client/android/sample/src/main/res/font/super_trivia.ttf":"divkit/public/client/android/sample/src/main/res/font/super_trivia.ttf",
|
||||
"client/android/sample/src/main/res/layout/activity_main_page.xml":"divkit/public/client/android/sample/src/main/res/layout/activity_main_page.xml",
|
||||
"client/android/sample/src/main/res/mipmap-anydpi-v26/ic_launcher.xml":"divkit/public/client/android/sample/src/main/res/mipmap-anydpi-v26/ic_launcher.xml",
|
||||
"client/android/sample/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml":"divkit/public/client/android/sample/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml",
|
||||
@@ -20000,6 +20005,39 @@
|
||||
"json-builder/typescript/test/tsconfig.json":"divkit/public/json-builder/typescript/test/tsconfig.json",
|
||||
"json-builder/typescript/tsconfig.eslint.json":"divkit/public/json-builder/typescript/tsconfig.eslint.json",
|
||||
"json-builder/typescript/tsconfig.json":"divkit/public/json-builder/typescript/tsconfig.json",
|
||||
"lessons_resources/06. Typed Actions/mixed_actions.json":"divkit/public/lessons_resources/06. Typed Actions/mixed_actions.json",
|
||||
"lessons_resources/06. Typed Actions/only_typed_actions.json":"divkit/public/lessons_resources/06. Typed Actions/only_typed_actions.json",
|
||||
"lessons_resources/07. DSL/layout_application/build.gradle":"divkit/public/lessons_resources/07. DSL/layout_application/build.gradle",
|
||||
"lessons_resources/07. DSL/layout_application/gradle/wrapper/gradle-wrapper.properties":"divkit/public/lessons_resources/07. DSL/layout_application/gradle/wrapper/gradle-wrapper.properties",
|
||||
"lessons_resources/07. DSL/layout_application/gradlew":"divkit/public/lessons_resources/07. DSL/layout_application/gradlew",
|
||||
"lessons_resources/07. DSL/layout_application/gradlew.bat":"divkit/public/lessons_resources/07. DSL/layout_application/gradlew.bat",
|
||||
"lessons_resources/07. DSL/layout_application/settings.gradle":"divkit/public/lessons_resources/07. DSL/layout_application/settings.gradle",
|
||||
"lessons_resources/07. DSL/layout_application/src/main/kotlin/Application.kt":"divkit/public/lessons_resources/07. DSL/layout_application/src/main/kotlin/Application.kt",
|
||||
"lessons_resources/07. DSL/layout_application/src/main/kotlin/CardTemplate.kt":"divkit/public/lessons_resources/07. DSL/layout_application/src/main/kotlin/CardTemplate.kt",
|
||||
"lessons_resources/07. DSL/layout_application/src/main/kotlin/LayoutRenderer.kt":"divkit/public/lessons_resources/07. DSL/layout_application/src/main/kotlin/LayoutRenderer.kt",
|
||||
"lessons_resources/07. DSL/layout_application/src/main/kotlin/data/PostData.kt":"divkit/public/lessons_resources/07. DSL/layout_application/src/main/kotlin/data/PostData.kt",
|
||||
"lessons_resources/07. DSL/layout_application/src/main/kotlin/data/Utils.kt":"divkit/public/lessons_resources/07. DSL/layout_application/src/main/kotlin/data/Utils.kt",
|
||||
"lessons_resources/07. DSL/layout_application/src/main/kotlin/data/Variables.kt":"divkit/public/lessons_resources/07. DSL/layout_application/src/main/kotlin/data/Variables.kt",
|
||||
"lessons_resources/07. DSL/layout_application/src/main/resources/output/div.json":"divkit/public/lessons_resources/07. DSL/layout_application/src/main/resources/output/div.json",
|
||||
"lessons_resources/08. Text/text_with_decoration.json":"divkit/public/lessons_resources/08. Text/text_with_decoration.json",
|
||||
"lessons_resources/08. Text/text_without_decoration.json":"divkit/public/lessons_resources/08. Text/text_without_decoration.json",
|
||||
"lessons_resources/09. Containers/container/constrained.json":"divkit/public/lessons_resources/09. Containers/container/constrained.json",
|
||||
"lessons_resources/09. Containers/container/overlap.json":"divkit/public/lessons_resources/09. Containers/container/overlap.json",
|
||||
"lessons_resources/09. Containers/container/separator.json":"divkit/public/lessons_resources/09. Containers/container/separator.json",
|
||||
"lessons_resources/09. Containers/container/wrap.json":"divkit/public/lessons_resources/09. Containers/container/wrap.json",
|
||||
"lessons_resources/09. Containers/gallery/gallery.json":"divkit/public/lessons_resources/09. Containers/gallery/gallery.json",
|
||||
"lessons_resources/09. Containers/grid/grid.json":"divkit/public/lessons_resources/09. Containers/grid/grid.json",
|
||||
"lessons_resources/09. Containers/layout_provider.json":"divkit/public/lessons_resources/09. Containers/layout_provider.json",
|
||||
"lessons_resources/09. Containers/pager/infinite_scroll.json":"divkit/public/lessons_resources/09. Containers/pager/infinite_scroll.json",
|
||||
"lessons_resources/09. Containers/tab/simple_tab.json":"divkit/public/lessons_resources/09. Containers/tab/simple_tab.json",
|
||||
"lessons_resources/09. Containers/tab/title_animations.json":"divkit/public/lessons_resources/09. Containers/tab/title_animations.json",
|
||||
"lessons_resources/10. Item builder/item_builder.json":"divkit/public/lessons_resources/10. Item builder/item_builder.json",
|
||||
"lessons_resources/11. Animations/action_animation.json":"divkit/public/lessons_resources/11. Animations/action_animation.json",
|
||||
"lessons_resources/11. Animations/animators.json":"divkit/public/lessons_resources/11. Animations/animators.json",
|
||||
"lessons_resources/11. Animations/transition_animation.json":"divkit/public/lessons_resources/11. Animations/transition_animation.json",
|
||||
"lessons_resources/11. Animations/transition_change_animation.json":"divkit/public/lessons_resources/11. Animations/transition_change_animation.json",
|
||||
"lessons_resources/11. Item builder/item_builder.json":"divkit/public/lessons_resources/11. Item builder/item_builder.json",
|
||||
"lessons_resources/12. User-declared functions/function.json":"divkit/public/lessons_resources/12. User-declared functions/function.json",
|
||||
"readme_pictures/ads-sdk.png":"divkit/public/readme_pictures/ads-sdk.png",
|
||||
"readme_pictures/alice.png":"divkit/public/readme_pictures/alice.png",
|
||||
"readme_pictures/app_screen.png":"divkit/public/readme_pictures/app_screen.png",
|
||||
|
||||
@@ -1,3 +1,16 @@
|
||||
# DivKit Sample app
|
||||
|
||||
Presents a minimalistic application showing the capabilities of the DivKit framework.
|
||||
|
||||
The application uses fonts free for personal and commercial use, the intellectual rights to which belong to the following authors:
|
||||
Super Trivia Font:
|
||||
Designed by: All Super Font https://nhfonts.etsy.com/
|
||||
https://fontesk.com/super-trivia-font/
|
||||
|
||||
Artika Font:
|
||||
Designed by: Anastasiya Davydava https://www.behance.net/anastasdavydav
|
||||
https://fontesk.com/artika-font/
|
||||
|
||||
# DivKit Android. Quick start.
|
||||
## Connect the library.
|
||||
To connect the library to the project, all you have to do is add three dependencies to build.gradle:
|
||||
|
||||
@@ -39,6 +39,7 @@ dependencies {
|
||||
implementation project(':div-rive')
|
||||
implementation project(':utils')
|
||||
implementation project(':div-pinch-to-zoom')
|
||||
implementation project(':div-markdown')
|
||||
|
||||
implementation libs.androidx.coreKtx
|
||||
implementation libs.androidx.activity
|
||||
|
||||
@@ -230,6 +230,7 @@
|
||||
{
|
||||
"type": "input",
|
||||
"hint_text": "Toast your mind",
|
||||
"font_family": "super_trivia",
|
||||
"hint_color": "#666",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
@@ -281,6 +282,7 @@
|
||||
{
|
||||
"type": "text",
|
||||
"text": "Toast!",
|
||||
"font_family": "super_trivia",
|
||||
"paddings": {
|
||||
"top": 10,
|
||||
"left": 10,
|
||||
@@ -306,6 +308,28 @@
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "text",
|
||||
"text_alignment_horizontal": "center",
|
||||
"text": "**Info**: no error in code `println(\"Hello World!\")`",
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#fff"
|
||||
}
|
||||
],
|
||||
"paddings": {
|
||||
"top": 5,
|
||||
"bottom": 5,
|
||||
"left": 5,
|
||||
"right": 5
|
||||
},
|
||||
"extensions": [
|
||||
{
|
||||
"id": "markdown"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "divgram_card",
|
||||
"likes_counter": "@{card0.likes}",
|
||||
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
package com.yandex.divkit.sample
|
||||
|
||||
import android.content.Context
|
||||
import android.graphics.Typeface
|
||||
import androidx.core.content.res.ResourcesCompat
|
||||
import com.yandex.div.core.font.DivTypefaceProvider
|
||||
|
||||
class ArtikaTypefaceProvider(
|
||||
private val context: Context,
|
||||
) : DivTypefaceProvider {
|
||||
override fun getRegular(): Typeface {
|
||||
return ResourcesCompat.getFont(context, R.font.artika) ?: Typeface.DEFAULT
|
||||
}
|
||||
|
||||
override fun getMedium(): Typeface {
|
||||
return ResourcesCompat.getFont(context, R.font.artika) ?: Typeface.DEFAULT
|
||||
}
|
||||
|
||||
override fun getLight(): Typeface {
|
||||
return ResourcesCompat.getFont(context, R.font.artika) ?: Typeface.DEFAULT
|
||||
}
|
||||
|
||||
override fun getBold(): Typeface {
|
||||
return ResourcesCompat.getFont(context, R.font.artika) ?: Typeface.DEFAULT
|
||||
}
|
||||
}
|
||||
@@ -4,6 +4,7 @@ import android.os.Bundle
|
||||
import androidx.appcompat.app.AppCompatActivity
|
||||
import com.yandex.div.core.Div2Context
|
||||
import com.yandex.div.core.DivConfiguration
|
||||
import com.yandex.div.markdown.DivMarkdownExtensionHandler
|
||||
import com.yandex.div.picasso.PicassoDivImageLoader
|
||||
import com.yandex.div.rive.OkHttpDivRiveNetworkDelegate
|
||||
import com.yandex.div.rive.RiveCustomViewAdapter
|
||||
@@ -48,8 +49,22 @@ class MainPageActivity : AppCompatActivity() {
|
||||
DivPinchToZoomConfiguration.Builder(this).build()
|
||||
)
|
||||
)
|
||||
.extension(DivMarkdownExtensionHandler(this))
|
||||
.divCustomContainerViewAdapter(RiveCustomViewAdapter.Builder(this, OkHttpDivRiveNetworkDelegate(OkHttpClient.Builder().build())).build())
|
||||
.visualErrorsEnabled(true)
|
||||
.apply {
|
||||
if (ENABLE_CUSTOM_FONTS) {
|
||||
typefaceProvider(MultiTypefaceProvider(this@MainPageActivity))
|
||||
}
|
||||
}
|
||||
.additionalTypefaceProviders(mapOf(
|
||||
"artika" to ArtikaTypefaceProvider(this@MainPageActivity),
|
||||
"super_trivia" to SuperTriviaTypefaceProvider(this@MainPageActivity),
|
||||
))
|
||||
.build()
|
||||
}
|
||||
|
||||
companion object {
|
||||
private const val ENABLE_CUSTOM_FONTS = true
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,26 @@
|
||||
package com.yandex.divkit.sample
|
||||
|
||||
import android.content.Context
|
||||
import android.graphics.Typeface
|
||||
import androidx.core.content.res.ResourcesCompat
|
||||
import com.yandex.div.core.font.DivTypefaceProvider
|
||||
|
||||
class MultiTypefaceProvider(
|
||||
private val context: Context,
|
||||
) : DivTypefaceProvider {
|
||||
override fun getRegular(): Typeface {
|
||||
return ResourcesCompat.getFont(context, R.font.artika) ?: Typeface.DEFAULT
|
||||
}
|
||||
|
||||
override fun getMedium(): Typeface {
|
||||
return ResourcesCompat.getFont(context, R.font.artika) ?: Typeface.DEFAULT
|
||||
}
|
||||
|
||||
override fun getLight(): Typeface {
|
||||
return ResourcesCompat.getFont(context, R.font.artika) ?: Typeface.DEFAULT
|
||||
}
|
||||
|
||||
override fun getBold(): Typeface {
|
||||
return ResourcesCompat.getFont(context, R.font.super_trivia) ?: Typeface.DEFAULT
|
||||
}
|
||||
}
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
package com.yandex.divkit.sample
|
||||
|
||||
import android.content.Context
|
||||
import android.graphics.Typeface
|
||||
import androidx.core.content.res.ResourcesCompat
|
||||
import com.yandex.div.core.font.DivTypefaceProvider
|
||||
|
||||
class SuperTriviaTypefaceProvider(
|
||||
private val context: Context,
|
||||
) : DivTypefaceProvider {
|
||||
override fun getRegular(): Typeface {
|
||||
return ResourcesCompat.getFont(context, R.font.super_trivia) ?: Typeface.DEFAULT
|
||||
}
|
||||
|
||||
override fun getMedium(): Typeface {
|
||||
return ResourcesCompat.getFont(context, R.font.super_trivia) ?: Typeface.DEFAULT
|
||||
}
|
||||
|
||||
override fun getLight(): Typeface {
|
||||
return ResourcesCompat.getFont(context, R.font.super_trivia) ?: Typeface.DEFAULT
|
||||
}
|
||||
|
||||
override fun getBold(): Typeface {
|
||||
return ResourcesCompat.getFont(context, R.font.super_trivia) ?: Typeface.DEFAULT
|
||||
}
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,172 @@
|
||||
{
|
||||
"templates": {
|
||||
"button": {
|
||||
"type": "text",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"height": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"paddings": {
|
||||
"left": 16,
|
||||
"top": 16,
|
||||
"right": 16,
|
||||
"bottom": 16
|
||||
},
|
||||
"margins": {
|
||||
"top": 16,
|
||||
"bottom": 16,
|
||||
"left": 16,
|
||||
"right": 16
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 8
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#0E000000"
|
||||
}
|
||||
],
|
||||
"font_size": 16,
|
||||
"font_weight": "medium",
|
||||
"text_alignment_vertical": "center",
|
||||
"text_alignment_horizontal": "center",
|
||||
"text_color": "#000000",
|
||||
"alpha": 1,
|
||||
"alignment_horizontal": "center",
|
||||
"alignment_vertical": "center"
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "div2_sample_card",
|
||||
"variables": [
|
||||
{
|
||||
"name": "my_edit_text",
|
||||
"type": "string",
|
||||
"value": ""
|
||||
},
|
||||
{
|
||||
"name": "in_text_state",
|
||||
"type": "boolean",
|
||||
"value": false
|
||||
}
|
||||
],
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "container",
|
||||
"items": [
|
||||
{
|
||||
"type": "state",
|
||||
"id": "data_state",
|
||||
"states": [
|
||||
{
|
||||
"state_id": "url",
|
||||
"div": {
|
||||
"type": "button",
|
||||
"text": "Copy url",
|
||||
"actions": [
|
||||
{
|
||||
"typed": {
|
||||
"type": "copy_to_clipboard",
|
||||
"content": {
|
||||
"type": "url",
|
||||
"value": "https://ya.ru/"
|
||||
}
|
||||
},
|
||||
"log_id": "copy url"
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
"state_id": "text",
|
||||
"div": {
|
||||
"type": "button",
|
||||
"text": "Copy string",
|
||||
"actions": [
|
||||
{
|
||||
"typed": {
|
||||
"type": "copy_to_clipboard",
|
||||
"content": {
|
||||
"type": "text",
|
||||
"value": "Copied string"
|
||||
}
|
||||
},
|
||||
"log_id": "copy string"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "button",
|
||||
"text": "Switch content",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "switch_to_url",
|
||||
"is_enabled": "@{in_text_state}",
|
||||
"url": "div-action://set_state?state_id=0/data_state/url"
|
||||
},
|
||||
{
|
||||
"log_id": "switch_to_text",
|
||||
"is_enabled": "@{!in_text_state}",
|
||||
"url": "div-action://set_state?state_id=0/data_state/text"
|
||||
},
|
||||
{
|
||||
"log_id": "remember_state",
|
||||
"url": "div-action://set_variable?name=in_text_state&value=@{!in_text_state}"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "input",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"height": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"margins": {
|
||||
"left": 16,
|
||||
"top": 20,
|
||||
"right": 16,
|
||||
"bottom": 16
|
||||
},
|
||||
"paddings": {
|
||||
"left": 16,
|
||||
"top": 10,
|
||||
"right": 16,
|
||||
"bottom": 10
|
||||
},
|
||||
"alpha": 1,
|
||||
"alignment_horizontal": "center",
|
||||
"alignment_vertical": "center",
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#0e000000"
|
||||
}
|
||||
],
|
||||
"border": {
|
||||
"corner_radius": 8
|
||||
},
|
||||
"font_size": 16,
|
||||
"font_weight": "medium",
|
||||
"text_color": "#000000",
|
||||
"hint_text": "Paste here",
|
||||
"text_variable": "my_edit_text",
|
||||
"line_height": 22,
|
||||
"select_all_on_focus": 1,
|
||||
"keyboard_type": "single_line_text"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,185 @@
|
||||
{
|
||||
"templates": {
|
||||
"button": {
|
||||
"type": "text",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"height": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"paddings": {
|
||||
"left": 16,
|
||||
"top": 16,
|
||||
"right": 16,
|
||||
"bottom": 16
|
||||
},
|
||||
"margins": {
|
||||
"top": 16,
|
||||
"bottom": 16,
|
||||
"left": 16,
|
||||
"right": 16
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 8
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#0E000000"
|
||||
}
|
||||
],
|
||||
"font_size": 16,
|
||||
"font_weight": "medium",
|
||||
"text_alignment_vertical": "center",
|
||||
"text_alignment_horizontal": "center",
|
||||
"text_color": "#000000",
|
||||
"alpha": 1,
|
||||
"alignment_horizontal": "center",
|
||||
"alignment_vertical": "center"
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "div2_sample_card",
|
||||
"variables": [
|
||||
{
|
||||
"name": "my_edit_text",
|
||||
"type": "string",
|
||||
"value": ""
|
||||
},
|
||||
{
|
||||
"name": "in_text_state",
|
||||
"type": "boolean",
|
||||
"value": false
|
||||
}
|
||||
],
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "container",
|
||||
"items": [
|
||||
{
|
||||
"type": "state",
|
||||
"id": "data_state",
|
||||
"states": [
|
||||
{
|
||||
"state_id": "url",
|
||||
"div": {
|
||||
"type": "button",
|
||||
"text": "Copy url",
|
||||
"actions": [
|
||||
{
|
||||
"typed": {
|
||||
"type": "copy_to_clipboard",
|
||||
"content": {
|
||||
"type": "url",
|
||||
"value": "https://ya.ru/"
|
||||
}
|
||||
},
|
||||
"log_id": "copy url"
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
"state_id": "text",
|
||||
"div": {
|
||||
"type": "button",
|
||||
"text": "Copy string",
|
||||
"actions": [
|
||||
{
|
||||
"typed": {
|
||||
"type": "copy_to_clipboard",
|
||||
"content": {
|
||||
"type": "text",
|
||||
"value": "Copied string"
|
||||
}
|
||||
},
|
||||
"log_id": "copy string"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "button",
|
||||
"text": "Switch content",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "switch_to_url",
|
||||
"is_enabled": "@{in_text_state}",
|
||||
"typed": {
|
||||
"type": "set_state",
|
||||
"state_id": "0/data_state/url"
|
||||
}
|
||||
},
|
||||
{
|
||||
"log_id": "switch_to_text",
|
||||
"is_enabled": "@{!in_text_state}",
|
||||
"typed": {
|
||||
"type": "set_state",
|
||||
"state_id": "0/data_state/text"
|
||||
}
|
||||
},
|
||||
{
|
||||
"log_id": "remember_state",
|
||||
"typed": {
|
||||
"type": "set_variable",
|
||||
"variable_name": "in_text_state",
|
||||
"value": {
|
||||
"type": "boolean",
|
||||
"value": "@{!in_text_state}"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "input",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"height": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"margins": {
|
||||
"left": 16,
|
||||
"top": 20,
|
||||
"right": 16,
|
||||
"bottom": 16
|
||||
},
|
||||
"paddings": {
|
||||
"left": 16,
|
||||
"top": 10,
|
||||
"right": 16,
|
||||
"bottom": 10
|
||||
},
|
||||
"alpha": 1,
|
||||
"alignment_horizontal": "center",
|
||||
"alignment_vertical": "center",
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#0e000000"
|
||||
}
|
||||
],
|
||||
"border": {
|
||||
"corner_radius": 8
|
||||
},
|
||||
"font_size": 16,
|
||||
"font_weight": "medium",
|
||||
"text_color": "#000000",
|
||||
"hint_text": "Paste here",
|
||||
"text_variable": "my_edit_text",
|
||||
"line_height": 22,
|
||||
"select_all_on_focus": 1,
|
||||
"keyboard_type": "single_line_text"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
plugins {
|
||||
id 'application'
|
||||
id 'java'
|
||||
id 'org.jetbrains.kotlin.jvm' version '1.9.0'
|
||||
}
|
||||
|
||||
group = 'com.yandex.divkit.example.dsl'
|
||||
version = '1.0.0'
|
||||
|
||||
repositories {
|
||||
mavenCentral()
|
||||
}
|
||||
|
||||
dependencies {
|
||||
implementation "com.yandex.div:kotlin-json-builder:31.3.0"
|
||||
|
||||
implementation "com.fasterxml.jackson.core:jackson-core:2.18.2"
|
||||
implementation "com.fasterxml.jackson.core:jackson-databind:2.18.2"
|
||||
}
|
||||
|
||||
application {
|
||||
mainClass = 'com.yandex.divkit.example.dsl.Application'
|
||||
}
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
distributionBase=GRADLE_USER_HOME
|
||||
distributionPath=wrapper/dists
|
||||
distributionUrl=https\://services.gradle.org/distributions/gradle-8.9-bin.zip
|
||||
networkTimeout=10000
|
||||
validateDistributionUrl=true
|
||||
zipStoreBase=GRADLE_USER_HOME
|
||||
zipStorePath=wrapper/dists
|
||||
+252
@@ -0,0 +1,252 @@
|
||||
#!/bin/sh
|
||||
|
||||
#
|
||||
# Copyright © 2015-2021 the original authors.
|
||||
#
|
||||
# Licensed under the Apache License, Version 2.0 (the "License");
|
||||
# you may not use this file except in compliance with the License.
|
||||
# You may obtain a copy of the License at
|
||||
#
|
||||
# https://www.apache.org/licenses/LICENSE-2.0
|
||||
#
|
||||
# Unless required by applicable law or agreed to in writing, software
|
||||
# distributed under the License is distributed on an "AS IS" BASIS,
|
||||
# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
# See the License for the specific language governing permissions and
|
||||
# limitations under the License.
|
||||
#
|
||||
# SPDX-License-Identifier: Apache-2.0
|
||||
#
|
||||
|
||||
##############################################################################
|
||||
#
|
||||
# Gradle start up script for POSIX generated by Gradle.
|
||||
#
|
||||
# Important for running:
|
||||
#
|
||||
# (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is
|
||||
# noncompliant, but you have some other compliant shell such as ksh or
|
||||
# bash, then to run this script, type that shell name before the whole
|
||||
# command line, like:
|
||||
#
|
||||
# ksh Gradle
|
||||
#
|
||||
# Busybox and similar reduced shells will NOT work, because this script
|
||||
# requires all of these POSIX shell features:
|
||||
# * functions;
|
||||
# * expansions «$var», «${var}», «${var:-default}», «${var+SET}»,
|
||||
# «${var#prefix}», «${var%suffix}», and «$( cmd )»;
|
||||
# * compound commands having a testable exit status, especially «case»;
|
||||
# * various built-in commands including «command», «set», and «ulimit».
|
||||
#
|
||||
# Important for patching:
|
||||
#
|
||||
# (2) This script targets any POSIX shell, so it avoids extensions provided
|
||||
# by Bash, Ksh, etc; in particular arrays are avoided.
|
||||
#
|
||||
# The "traditional" practice of packing multiple parameters into a
|
||||
# space-separated string is a well documented source of bugs and security
|
||||
# problems, so this is (mostly) avoided, by progressively accumulating
|
||||
# options in "$@", and eventually passing that to Java.
|
||||
#
|
||||
# Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS,
|
||||
# and GRADLE_OPTS) rely on word-splitting, this is performed explicitly;
|
||||
# see the in-line comments for details.
|
||||
#
|
||||
# There are tweaks for specific operating systems such as AIX, CygWin,
|
||||
# Darwin, MinGW, and NonStop.
|
||||
#
|
||||
# (3) This script is generated from the Groovy template
|
||||
# https://github.com/gradle/gradle/blob/HEAD/platforms/jvm/plugins-application/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
|
||||
# within the Gradle project.
|
||||
#
|
||||
# You can find Gradle at https://github.com/gradle/gradle/.
|
||||
#
|
||||
##############################################################################
|
||||
|
||||
# Attempt to set APP_HOME
|
||||
|
||||
# Resolve links: $0 may be a link
|
||||
app_path=$0
|
||||
|
||||
# Need this for daisy-chained symlinks.
|
||||
while
|
||||
APP_HOME=${app_path%"${app_path##*/}"} # leaves a trailing /; empty if no leading path
|
||||
[ -h "$app_path" ]
|
||||
do
|
||||
ls=$( ls -ld "$app_path" )
|
||||
link=${ls#*' -> '}
|
||||
case $link in #(
|
||||
/*) app_path=$link ;; #(
|
||||
*) app_path=$APP_HOME$link ;;
|
||||
esac
|
||||
done
|
||||
|
||||
# This is normally unused
|
||||
# shellcheck disable=SC2034
|
||||
APP_BASE_NAME=${0##*/}
|
||||
# Discard cd standard output in case $CDPATH is set (https://github.com/gradle/gradle/issues/25036)
|
||||
APP_HOME=$( cd -P "${APP_HOME:-./}" > /dev/null && printf '%s
|
||||
' "$PWD" ) || exit
|
||||
|
||||
# Use the maximum available, or set MAX_FD != -1 to use that value.
|
||||
MAX_FD=maximum
|
||||
|
||||
warn () {
|
||||
echo "$*"
|
||||
} >&2
|
||||
|
||||
die () {
|
||||
echo
|
||||
echo "$*"
|
||||
echo
|
||||
exit 1
|
||||
} >&2
|
||||
|
||||
# OS specific support (must be 'true' or 'false').
|
||||
cygwin=false
|
||||
msys=false
|
||||
darwin=false
|
||||
nonstop=false
|
||||
case "$( uname )" in #(
|
||||
CYGWIN* ) cygwin=true ;; #(
|
||||
Darwin* ) darwin=true ;; #(
|
||||
MSYS* | MINGW* ) msys=true ;; #(
|
||||
NONSTOP* ) nonstop=true ;;
|
||||
esac
|
||||
|
||||
CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
|
||||
|
||||
|
||||
# Determine the Java command to use to start the JVM.
|
||||
if [ -n "$JAVA_HOME" ] ; then
|
||||
if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
|
||||
# IBM's JDK on AIX uses strange locations for the executables
|
||||
JAVACMD=$JAVA_HOME/jre/sh/java
|
||||
else
|
||||
JAVACMD=$JAVA_HOME/bin/java
|
||||
fi
|
||||
if [ ! -x "$JAVACMD" ] ; then
|
||||
die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
|
||||
|
||||
Please set the JAVA_HOME variable in your environment to match the
|
||||
location of your Java installation."
|
||||
fi
|
||||
else
|
||||
JAVACMD=java
|
||||
if ! command -v java >/dev/null 2>&1
|
||||
then
|
||||
die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
|
||||
|
||||
Please set the JAVA_HOME variable in your environment to match the
|
||||
location of your Java installation."
|
||||
fi
|
||||
fi
|
||||
|
||||
# Increase the maximum file descriptors if we can.
|
||||
if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
|
||||
case $MAX_FD in #(
|
||||
max*)
|
||||
# In POSIX sh, ulimit -H is undefined. That's why the result is checked to see if it worked.
|
||||
# shellcheck disable=SC2039,SC3045
|
||||
MAX_FD=$( ulimit -H -n ) ||
|
||||
warn "Could not query maximum file descriptor limit"
|
||||
esac
|
||||
case $MAX_FD in #(
|
||||
'' | soft) :;; #(
|
||||
*)
|
||||
# In POSIX sh, ulimit -n is undefined. That's why the result is checked to see if it worked.
|
||||
# shellcheck disable=SC2039,SC3045
|
||||
ulimit -n "$MAX_FD" ||
|
||||
warn "Could not set maximum file descriptor limit to $MAX_FD"
|
||||
esac
|
||||
fi
|
||||
|
||||
# Collect all arguments for the java command, stacking in reverse order:
|
||||
# * args from the command line
|
||||
# * the main class name
|
||||
# * -classpath
|
||||
# * -D...appname settings
|
||||
# * --module-path (only if needed)
|
||||
# * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables.
|
||||
|
||||
# For Cygwin or MSYS, switch paths to Windows format before running java
|
||||
if "$cygwin" || "$msys" ; then
|
||||
APP_HOME=$( cygpath --path --mixed "$APP_HOME" )
|
||||
CLASSPATH=$( cygpath --path --mixed "$CLASSPATH" )
|
||||
|
||||
JAVACMD=$( cygpath --unix "$JAVACMD" )
|
||||
|
||||
# Now convert the arguments - kludge to limit ourselves to /bin/sh
|
||||
for arg do
|
||||
if
|
||||
case $arg in #(
|
||||
-*) false ;; # don't mess with options #(
|
||||
/?*) t=${arg#/} t=/${t%%/*} # looks like a POSIX filepath
|
||||
[ -e "$t" ] ;; #(
|
||||
*) false ;;
|
||||
esac
|
||||
then
|
||||
arg=$( cygpath --path --ignore --mixed "$arg" )
|
||||
fi
|
||||
# Roll the args list around exactly as many times as the number of
|
||||
# args, so each arg winds up back in the position where it started, but
|
||||
# possibly modified.
|
||||
#
|
||||
# NB: a `for` loop captures its iteration list before it begins, so
|
||||
# changing the positional parameters here affects neither the number of
|
||||
# iterations, nor the values presented in `arg`.
|
||||
shift # remove old arg
|
||||
set -- "$@" "$arg" # push replacement arg
|
||||
done
|
||||
fi
|
||||
|
||||
|
||||
# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
|
||||
DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
|
||||
|
||||
# Collect all arguments for the java command:
|
||||
# * DEFAULT_JVM_OPTS, JAVA_OPTS, JAVA_OPTS, and optsEnvironmentVar are not allowed to contain shell fragments,
|
||||
# and any embedded shellness will be escaped.
|
||||
# * For example: A user cannot expect ${Hostname} to be expanded, as it is an environment variable and will be
|
||||
# treated as '${Hostname}' itself on the command line.
|
||||
|
||||
set -- \
|
||||
"-Dorg.gradle.appname=$APP_BASE_NAME" \
|
||||
-classpath "$CLASSPATH" \
|
||||
org.gradle.wrapper.GradleWrapperMain \
|
||||
"$@"
|
||||
|
||||
# Stop when "xargs" is not available.
|
||||
if ! command -v xargs >/dev/null 2>&1
|
||||
then
|
||||
die "xargs is not available"
|
||||
fi
|
||||
|
||||
# Use "xargs" to parse quoted args.
|
||||
#
|
||||
# With -n1 it outputs one arg per line, with the quotes and backslashes removed.
|
||||
#
|
||||
# In Bash we could simply go:
|
||||
#
|
||||
# readarray ARGS < <( xargs -n1 <<<"$var" ) &&
|
||||
# set -- "${ARGS[@]}" "$@"
|
||||
#
|
||||
# but POSIX shell has neither arrays nor command substitution, so instead we
|
||||
# post-process each arg (as a line of input to sed) to backslash-escape any
|
||||
# character that might be a shell metacharacter, then use eval to reverse
|
||||
# that process (while maintaining the separation between arguments), and wrap
|
||||
# the whole thing up as a single "set" statement.
|
||||
#
|
||||
# This will of course break if any of these variables contains a newline or
|
||||
# an unmatched quote.
|
||||
#
|
||||
|
||||
eval "set -- $(
|
||||
printf '%s\n' "$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS" |
|
||||
xargs -n1 |
|
||||
sed ' s~[^-[:alnum:]+,./:=@_]~\\&~g; ' |
|
||||
tr '\n' ' '
|
||||
)" '"$@"'
|
||||
|
||||
exec "$JAVACMD" "$@"
|
||||
@@ -0,0 +1,94 @@
|
||||
@rem
|
||||
@rem Copyright 2015 the original author or authors.
|
||||
@rem
|
||||
@rem Licensed under the Apache License, Version 2.0 (the "License");
|
||||
@rem you may not use this file except in compliance with the License.
|
||||
@rem You may obtain a copy of the License at
|
||||
@rem
|
||||
@rem https://www.apache.org/licenses/LICENSE-2.0
|
||||
@rem
|
||||
@rem Unless required by applicable law or agreed to in writing, software
|
||||
@rem distributed under the License is distributed on an "AS IS" BASIS,
|
||||
@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
@rem See the License for the specific language governing permissions and
|
||||
@rem limitations under the License.
|
||||
@rem
|
||||
@rem SPDX-License-Identifier: Apache-2.0
|
||||
@rem
|
||||
|
||||
@if "%DEBUG%"=="" @echo off
|
||||
@rem ##########################################################################
|
||||
@rem
|
||||
@rem Gradle startup script for Windows
|
||||
@rem
|
||||
@rem ##########################################################################
|
||||
|
||||
@rem Set local scope for the variables with windows NT shell
|
||||
if "%OS%"=="Windows_NT" setlocal
|
||||
|
||||
set DIRNAME=%~dp0
|
||||
if "%DIRNAME%"=="" set DIRNAME=.
|
||||
@rem This is normally unused
|
||||
set APP_BASE_NAME=%~n0
|
||||
set APP_HOME=%DIRNAME%
|
||||
|
||||
@rem Resolve any "." and ".." in APP_HOME to make it shorter.
|
||||
for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
|
||||
|
||||
@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
|
||||
set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
|
||||
|
||||
@rem Find java.exe
|
||||
if defined JAVA_HOME goto findJavaFromJavaHome
|
||||
|
||||
set JAVA_EXE=java.exe
|
||||
%JAVA_EXE% -version >NUL 2>&1
|
||||
if %ERRORLEVEL% equ 0 goto execute
|
||||
|
||||
echo. 1>&2
|
||||
echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 1>&2
|
||||
echo. 1>&2
|
||||
echo Please set the JAVA_HOME variable in your environment to match the 1>&2
|
||||
echo location of your Java installation. 1>&2
|
||||
|
||||
goto fail
|
||||
|
||||
:findJavaFromJavaHome
|
||||
set JAVA_HOME=%JAVA_HOME:"=%
|
||||
set JAVA_EXE=%JAVA_HOME%/bin/java.exe
|
||||
|
||||
if exist "%JAVA_EXE%" goto execute
|
||||
|
||||
echo. 1>&2
|
||||
echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 1>&2
|
||||
echo. 1>&2
|
||||
echo Please set the JAVA_HOME variable in your environment to match the 1>&2
|
||||
echo location of your Java installation. 1>&2
|
||||
|
||||
goto fail
|
||||
|
||||
:execute
|
||||
@rem Setup the command line
|
||||
|
||||
set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
|
||||
|
||||
|
||||
@rem Execute Gradle
|
||||
"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %*
|
||||
|
||||
:end
|
||||
@rem End local scope for the variables with windows NT shell
|
||||
if %ERRORLEVEL% equ 0 goto mainEnd
|
||||
|
||||
:fail
|
||||
rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
|
||||
rem the _cmd.exe /c_ return code!
|
||||
set EXIT_CODE=%ERRORLEVEL%
|
||||
if %EXIT_CODE% equ 0 set EXIT_CODE=1
|
||||
if not ""=="%GRADLE_EXIT_CONSOLE%" exit %EXIT_CODE%
|
||||
exit /b %EXIT_CODE%
|
||||
|
||||
:mainEnd
|
||||
if "%OS%"=="Windows_NT" endlocal
|
||||
|
||||
:omega
|
||||
@@ -0,0 +1 @@
|
||||
rootProject.name = 'divkit_example_layout_generator'
|
||||
@@ -0,0 +1,18 @@
|
||||
package com.yandex.divkit.example.dsl
|
||||
|
||||
import com.fasterxml.jackson.databind.ObjectMapper
|
||||
import java.io.File
|
||||
|
||||
class Application {
|
||||
companion object {
|
||||
@JvmStatic
|
||||
fun main(args: Array<String>) {
|
||||
val data = LayoutRenderer().render()
|
||||
|
||||
val mapper = ObjectMapper().writerWithDefaultPrettyPrinter()
|
||||
val jsonText = mapper.writeValueAsString(data)
|
||||
|
||||
File("./src/main/resources/output/div.json").writeText(jsonText)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,53 @@
|
||||
package com.yandex.divkit.example.dsl
|
||||
|
||||
import com.yandex.divkit.example.dsl.data.Variables
|
||||
import divkit.dsl.Url
|
||||
import divkit.dsl.action
|
||||
import divkit.dsl.actionSetVariable
|
||||
import divkit.dsl.center
|
||||
import divkit.dsl.container
|
||||
import divkit.dsl.core.reference
|
||||
import divkit.dsl.defer
|
||||
import divkit.dsl.edgeInsets
|
||||
import divkit.dsl.fixedSize
|
||||
import divkit.dsl.image
|
||||
import divkit.dsl.stringValue
|
||||
import divkit.dsl.template
|
||||
import divkit.dsl.text
|
||||
|
||||
object CardTemplate {
|
||||
val descriptionRef = reference<String>("description")
|
||||
val imageRef = reference<Url>("img")
|
||||
|
||||
val template by lazy(LazyThreadSafetyMode.NONE) {
|
||||
template("sample_card") {
|
||||
container(
|
||||
margins = edgeInsets(all = 10),
|
||||
width = fixedSize(
|
||||
value = 150,
|
||||
),
|
||||
items = listOf(
|
||||
image().defer(
|
||||
imageUrl = imageRef,
|
||||
),
|
||||
text(
|
||||
textAlignmentHorizontal = center,
|
||||
).defer(
|
||||
text = descriptionRef,
|
||||
)
|
||||
),
|
||||
actions = listOf(
|
||||
action(
|
||||
logId = "post_selected",
|
||||
typed = actionSetVariable(
|
||||
variableName = Variables.SELECTED_POST_DESCRIPTION,
|
||||
value = stringValue().defer(
|
||||
value = descriptionRef,
|
||||
)
|
||||
)
|
||||
)
|
||||
)
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,92 @@
|
||||
package com.yandex.divkit.example.dsl
|
||||
|
||||
import com.yandex.divkit.example.dsl.data.PostData
|
||||
import com.yandex.divkit.example.dsl.data.Variables.SELECTED_POST_DESCRIPTION
|
||||
import com.yandex.divkit.example.dsl.data.exampleData
|
||||
import divkit.dsl.Div
|
||||
import divkit.dsl.Divan
|
||||
import divkit.dsl.Url
|
||||
import divkit.dsl.center
|
||||
import divkit.dsl.container
|
||||
import divkit.dsl.core.bind
|
||||
import divkit.dsl.core.expression
|
||||
import divkit.dsl.data
|
||||
import divkit.dsl.divan
|
||||
import divkit.dsl.evaluate
|
||||
import divkit.dsl.gallery
|
||||
import divkit.dsl.horizontal
|
||||
import divkit.dsl.render
|
||||
import divkit.dsl.root
|
||||
import divkit.dsl.scope.DivScope
|
||||
import divkit.dsl.stringVariable
|
||||
import divkit.dsl.text
|
||||
|
||||
class LayoutRenderer {
|
||||
fun render(): Divan {
|
||||
val postDataList = exampleData
|
||||
|
||||
return divan {
|
||||
data(
|
||||
logId = "generated_div",
|
||||
div = container(
|
||||
items = listOf(
|
||||
createSelectedPostIndicator(),
|
||||
createPostsGallery(postDataList),
|
||||
)
|
||||
),
|
||||
variables = listOf(
|
||||
stringVariable(
|
||||
name = SELECTED_POST_DESCRIPTION,
|
||||
value = "none",
|
||||
)
|
||||
)
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
private fun DivScope.createSelectedPostIndicator(): Div {
|
||||
return text(
|
||||
textAlignmentHorizontal = center,
|
||||
).evaluate(
|
||||
text = expression("Selected post: @{$SELECTED_POST_DESCRIPTION}"),
|
||||
)
|
||||
}
|
||||
|
||||
private fun DivScope.createPostsGallery(posts: List<PostData>): Div {
|
||||
return gallery(
|
||||
orientation = horizontal,
|
||||
items = buildList {
|
||||
posts.forEach { post ->
|
||||
add(createCard(post))
|
||||
}
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
private fun DivScope.createCard(person: PostData): Div {
|
||||
return with(CardTemplate) {
|
||||
render(
|
||||
template,
|
||||
descriptionRef bind person.description,
|
||||
imageRef bind Url.create(person.imageUrl.toString()),
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@Suppress("unused")
|
||||
private fun getLayoutHardWay(): Divan {
|
||||
return divan {
|
||||
data(
|
||||
logId = "generated_div",
|
||||
states = listOf(
|
||||
root(
|
||||
stateId = 0,
|
||||
div = container(
|
||||
// Layout
|
||||
)
|
||||
)
|
||||
),
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,8 @@
|
||||
package com.yandex.divkit.example.dsl.data
|
||||
|
||||
import java.net.URL
|
||||
|
||||
data class PostData(
|
||||
val imageUrl: URL,
|
||||
val description: String,
|
||||
)
|
||||
@@ -0,0 +1,22 @@
|
||||
package com.yandex.divkit.example.dsl.data
|
||||
|
||||
import java.net.URL
|
||||
|
||||
val exampleData = listOf(
|
||||
PostData(
|
||||
imageUrl = URL("https://raw.githubusercontent.com/divkit/divkit/91a4fe592d2ee4ba247f87cd769caf2527dcea80/client/android/divkit-demo-app/src/main/assets/images/district/item_background_1.png"),
|
||||
description = "Аллея со скамейкой"
|
||||
),
|
||||
PostData(
|
||||
imageUrl = URL("https://raw.githubusercontent.com/divkit/divkit/91a4fe592d2ee4ba247f87cd769caf2527dcea80/client/android/divkit-demo-app/src/main/assets/images/district/item_background_2.png"),
|
||||
description = "Дорожка около пруда"
|
||||
),
|
||||
PostData(
|
||||
imageUrl = URL("https://raw.githubusercontent.com/divkit/divkit/91a4fe592d2ee4ba247f87cd769caf2527dcea80/client/android/divkit-demo-app/src/main/assets/images/district/item_background_3.png"),
|
||||
description = "Пересечение дорожек"
|
||||
),
|
||||
PostData(
|
||||
imageUrl = URL("https://raw.githubusercontent.com/divkit/divkit/91a4fe592d2ee4ba247f87cd769caf2527dcea80/client/android/divkit-demo-app/src/main/assets/images/district/item_background_4.png"),
|
||||
description = "Вечерняя аллея с фонарём"
|
||||
),
|
||||
)
|
||||
@@ -0,0 +1,5 @@
|
||||
package com.yandex.divkit.example.dsl.data
|
||||
|
||||
object Variables {
|
||||
val SELECTED_POST_DESCRIPTION = "selected_post_description"
|
||||
}
|
||||
@@ -0,0 +1,75 @@
|
||||
{
|
||||
"card" : {
|
||||
"log_id" : "generated_div",
|
||||
"states" : [ {
|
||||
"state_id" : 0,
|
||||
"div" : {
|
||||
"type" : "container",
|
||||
"items" : [ {
|
||||
"type" : "text",
|
||||
"text" : "Selected post: @{selected_post_description}",
|
||||
"text_alignment_horizontal" : "center"
|
||||
}, {
|
||||
"type" : "gallery",
|
||||
"items" : [ {
|
||||
"type" : "sample_card",
|
||||
"description" : "Аллея со скамейкой",
|
||||
"img" : "https://raw.githubusercontent.com/divkit/divkit/91a4fe592d2ee4ba247f87cd769caf2527dcea80/client/android/divkit-demo-app/src/main/assets/images/district/item_background_1.png"
|
||||
}, {
|
||||
"type" : "sample_card",
|
||||
"description" : "Дорожка около пруда",
|
||||
"img" : "https://raw.githubusercontent.com/divkit/divkit/91a4fe592d2ee4ba247f87cd769caf2527dcea80/client/android/divkit-demo-app/src/main/assets/images/district/item_background_2.png"
|
||||
}, {
|
||||
"type" : "sample_card",
|
||||
"description" : "Пересечение дорожек",
|
||||
"img" : "https://raw.githubusercontent.com/divkit/divkit/91a4fe592d2ee4ba247f87cd769caf2527dcea80/client/android/divkit-demo-app/src/main/assets/images/district/item_background_3.png"
|
||||
}, {
|
||||
"type" : "sample_card",
|
||||
"description" : "Вечерняя аллея с фонарём",
|
||||
"img" : "https://raw.githubusercontent.com/divkit/divkit/91a4fe592d2ee4ba247f87cd769caf2527dcea80/client/android/divkit-demo-app/src/main/assets/images/district/item_background_4.png"
|
||||
} ],
|
||||
"orientation" : "horizontal"
|
||||
} ]
|
||||
}
|
||||
} ],
|
||||
"variables" : [ {
|
||||
"type" : "string",
|
||||
"name" : "selected_post_description",
|
||||
"value" : "none"
|
||||
} ]
|
||||
},
|
||||
"templates" : {
|
||||
"sample_card" : {
|
||||
"type" : "container",
|
||||
"actions" : [ {
|
||||
"log_id" : "post_selected",
|
||||
"typed" : {
|
||||
"type" : "set_variable",
|
||||
"value" : {
|
||||
"type" : "string",
|
||||
"$value" : "description"
|
||||
},
|
||||
"variable_name" : "selected_post_description"
|
||||
}
|
||||
} ],
|
||||
"items" : [ {
|
||||
"type" : "image",
|
||||
"$image_url" : "img"
|
||||
}, {
|
||||
"type" : "text",
|
||||
"$text" : "description",
|
||||
"text_alignment_horizontal" : "center"
|
||||
} ],
|
||||
"margins" : {
|
||||
"bottom" : 10,
|
||||
"left" : 10,
|
||||
"right" : 10,
|
||||
"top" : 10
|
||||
},
|
||||
"width" : {
|
||||
"type" : "fixed",
|
||||
"value" : 150
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,128 @@
|
||||
{
|
||||
"templates": {
|
||||
"example_text": {
|
||||
"type": "text",
|
||||
"font_size": 20,
|
||||
"margins": {
|
||||
"bottom": 10,
|
||||
"top": 10
|
||||
}
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "generated_div",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"margins": {
|
||||
"left": 10,
|
||||
"right": 10
|
||||
},
|
||||
"type": "container",
|
||||
"separator": {
|
||||
"show_between": true,
|
||||
"style": {
|
||||
"color": "#999",
|
||||
"type": "shape_drawable",
|
||||
"shape": {
|
||||
"type": "rounded_rectangle",
|
||||
"item_width": {
|
||||
"type": "fixed",
|
||||
"value": 1000
|
||||
},
|
||||
"item_height": {
|
||||
"type": "fixed",
|
||||
"value": 1
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "example_text",
|
||||
"text": "Long text that should not take up more than 1 line",
|
||||
"max_lines": 1,
|
||||
"ellipsis": {
|
||||
"text": "… SHOW MORE",
|
||||
"ranges": [
|
||||
{
|
||||
"start": 2,
|
||||
"end": 11,
|
||||
"font_size": 11,
|
||||
"font_weight": "medium",
|
||||
"text_color": "#95A5A6"
|
||||
}
|
||||
]
|
||||
},
|
||||
"text_shadow": {
|
||||
"color": "#30d5c8",
|
||||
"alpha": 1,
|
||||
"blur": 1,
|
||||
"offset": {
|
||||
"x": {
|
||||
"value": 3
|
||||
},
|
||||
"y": {
|
||||
"value": 3
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "example_text",
|
||||
"text": "Long text with many possibilities for highlighting and adding some elements. For example,\n Su\u00ADper\u00ADcal\u00ADifrag\u00ADilis\u00ADtic\u00ADex\u00ADpi\u00ADali\u00ADdo\u00ADcious",
|
||||
"alignment_horizontal": "end",
|
||||
"width":{
|
||||
"type": "fixed",
|
||||
"value": 260
|
||||
},
|
||||
"text_alignment_horizontal": "end",
|
||||
"text_gradient": {
|
||||
"type": "gradient",
|
||||
"angle": 60,
|
||||
"colors": [
|
||||
"#8b00ff",
|
||||
"#ffa500"
|
||||
]
|
||||
},
|
||||
"images": [
|
||||
{
|
||||
"start": 67,
|
||||
"url": "https://yastatic.net/s3/doc-binary/src/divkit/divkitfav.png"
|
||||
}
|
||||
],
|
||||
"ranges": [
|
||||
{
|
||||
"start": 0,
|
||||
"end": 4,
|
||||
"letter_spacing": 2
|
||||
},
|
||||
{
|
||||
"start": 38,
|
||||
"end": 50,
|
||||
"font_weight": "bold"
|
||||
},
|
||||
{
|
||||
"start": 78,
|
||||
"end": 89,
|
||||
"underline": "single"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "example_text",
|
||||
"text_alignment_horizontal": "center",
|
||||
"text": "**Info**: no error in code `println(\"Hello World!\")`",
|
||||
"extensions": [
|
||||
{
|
||||
"id": "markdown"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,59 @@
|
||||
{
|
||||
"templates": {
|
||||
"example_text": {
|
||||
"type": "text",
|
||||
"font_size": 20,
|
||||
"margins": {
|
||||
"bottom": 10,
|
||||
"top": 10
|
||||
}
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "generated_div",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"margins": {
|
||||
"left": 10,
|
||||
"right": 10
|
||||
},
|
||||
"type": "container",
|
||||
"separator": {
|
||||
"show_between": true,
|
||||
"style": {
|
||||
"color": "#999",
|
||||
"type": "shape_drawable",
|
||||
"shape": {
|
||||
"type": "rounded_rectangle",
|
||||
"item_width": {
|
||||
"type": "fixed",
|
||||
"value": 1000
|
||||
},
|
||||
"item_height": {
|
||||
"type": "fixed",
|
||||
"value": 1
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "example_text",
|
||||
"text": "Long text that should not take up more than 1 line"
|
||||
},
|
||||
{
|
||||
"type": "example_text",
|
||||
"text": "Long text with many possibilities for highlighting and adding some elements. For example, Supercalifragilisticexpialidocious"
|
||||
},
|
||||
{
|
||||
"type": "example_text",
|
||||
"text": "**Info**: no error in code `println(\"Hello World!\")`"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,78 @@
|
||||
{
|
||||
"templates": {
|
||||
"basic_text": {
|
||||
"type": "text",
|
||||
"font_size": 15,
|
||||
"margins": {
|
||||
"top": 12,
|
||||
"bottom": 12
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 10
|
||||
},
|
||||
"paddings": {
|
||||
"top": 10,
|
||||
"bottom": 10,
|
||||
"start": 10,
|
||||
"end": 10
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#600000ff"
|
||||
}
|
||||
],
|
||||
"width": {
|
||||
"type": "wrap_content",
|
||||
"constrained": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "generated_div",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 350
|
||||
},
|
||||
"margins": {
|
||||
"top": 10,
|
||||
"left": 10,
|
||||
"right": 10,
|
||||
"bottom": 10
|
||||
},
|
||||
"border": {
|
||||
"stroke": {
|
||||
"color": "#000"
|
||||
}
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "container",
|
||||
"orientation": "horizontal",
|
||||
"items": [
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 1.1 has a larger width"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 1.2"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 1.3"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,73 @@
|
||||
{
|
||||
"templates": {
|
||||
"block": {
|
||||
"type": "container",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 100
|
||||
},
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 100
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"$color": "background_color"
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "generated_div",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"margins": {
|
||||
"top": 10,
|
||||
"left": 10,
|
||||
"right": 10,
|
||||
"bottom": 10
|
||||
},
|
||||
"type": "container",
|
||||
"orientation": "overlap",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
},
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "block",
|
||||
"background_color": "#6000ff00"
|
||||
},
|
||||
{
|
||||
"type": "block",
|
||||
"background_color": "#600000ff",
|
||||
"alignment_horizontal": "end",
|
||||
"alignment_vertical": "bottom"
|
||||
},
|
||||
{
|
||||
"type": "text",
|
||||
"text": "Everything in one container",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 100
|
||||
},
|
||||
"text_alignment_horizontal": "center",
|
||||
"alignment_horizontal": "end",
|
||||
"font_size": 15,
|
||||
"margins": {
|
||||
"top": 12
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,92 @@
|
||||
{
|
||||
"templates": {
|
||||
"basic_text": {
|
||||
"type": "text",
|
||||
"font_size": 15,
|
||||
"margins": {
|
||||
"top": 12,
|
||||
"bottom": 12
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 10
|
||||
},
|
||||
"paddings": {
|
||||
"top": 10,
|
||||
"bottom": 10,
|
||||
"start": 10,
|
||||
"end": 10
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#600000ff"
|
||||
}
|
||||
],
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
}
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "generated_div",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"margins": {
|
||||
"top": 10,
|
||||
"left": 10,
|
||||
"right": 10,
|
||||
"bottom": 10
|
||||
},
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"border": {
|
||||
"stroke": {
|
||||
"color": "#000"
|
||||
}
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"separator": {
|
||||
"style": {
|
||||
"type": "shape_drawable",
|
||||
"color": "#000",
|
||||
"shape": {
|
||||
"type": "rounded_rectangle",
|
||||
"item_width": {
|
||||
"type": "fixed",
|
||||
"value": 100
|
||||
},
|
||||
"item_height": {
|
||||
"type": "fixed",
|
||||
"value": 1
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"content_alignment_horizontal": "center",
|
||||
"items": [
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 1.1"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 1.2"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 1.3"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,75 @@
|
||||
{
|
||||
"templates": {
|
||||
"basic_text": {
|
||||
"type": "text",
|
||||
"font_size": 15,
|
||||
"margins": {
|
||||
"top": 12,
|
||||
"bottom": 12
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 10
|
||||
},
|
||||
"paddings": {
|
||||
"top": 10,
|
||||
"bottom": 10,
|
||||
"start": 10,
|
||||
"end": 10
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#600000ff"
|
||||
}
|
||||
],
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
}
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "generated_div",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"margins": {
|
||||
"top": 10,
|
||||
"left": 10,
|
||||
"right": 10,
|
||||
"bottom": 10
|
||||
},
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"border": {
|
||||
"stroke": {
|
||||
"color": "#000"
|
||||
}
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "container",
|
||||
"orientation": "horizontal",
|
||||
"layout_mode": "wrap",
|
||||
"items": [
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 1.1"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 1.2"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 1.3"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,148 @@
|
||||
{
|
||||
"templates": {
|
||||
"basic_text": {
|
||||
"type": "text",
|
||||
"font_size": 15,
|
||||
"margins": {
|
||||
"top": 12,
|
||||
"bottom": 12,
|
||||
"start": 12,
|
||||
"end": 12
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 10
|
||||
},
|
||||
"paddings": {
|
||||
"top": 10,
|
||||
"bottom": 10,
|
||||
"start": 10,
|
||||
"end": 10
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#600000ff"
|
||||
}
|
||||
],
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"alignment_horizontal": "center",
|
||||
"reuse_id": "text"
|
||||
},
|
||||
"image_block": {
|
||||
"type": "container",
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#2000ffff"
|
||||
}
|
||||
],
|
||||
"border": {
|
||||
"corner_radius": 10
|
||||
},
|
||||
"margins": {
|
||||
"top": 12,
|
||||
"bottom": 12,
|
||||
"start": 12,
|
||||
"end": 12
|
||||
},
|
||||
"paddings": {
|
||||
"top": 10,
|
||||
"bottom": 10,
|
||||
"start": 10,
|
||||
"end": 10
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "image",
|
||||
"$image_url": "url",
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 250
|
||||
},
|
||||
"scale": "fit"
|
||||
}
|
||||
],
|
||||
"reuse_id": "image"
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "generated_div",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"margins": {
|
||||
"top": 10,
|
||||
"left": 10,
|
||||
"right": 10,
|
||||
"bottom": 10
|
||||
},
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"border": {
|
||||
"stroke": {
|
||||
"color": "#000"
|
||||
}
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "gallery",
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 300
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 1"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 2"
|
||||
},
|
||||
{
|
||||
"type": "image_block",
|
||||
"url": "https://yastatic.net/s3/home/divkit/wombat.jpg"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 3"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 4"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 5"
|
||||
},
|
||||
{
|
||||
"type": "image_block",
|
||||
"url": "https://yastatic.net/s3/home/divkit/ducks.jpg"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 6"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 7"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 8"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 9"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,99 @@
|
||||
{
|
||||
"templates": {
|
||||
"grid_element": {
|
||||
"type": "container",
|
||||
"width": {
|
||||
"type": "match_parent",
|
||||
"weight": 1
|
||||
},
|
||||
"height": {
|
||||
"type": "match_parent",
|
||||
"weight": 1
|
||||
},
|
||||
"margins": {
|
||||
"left": 8,
|
||||
"top": 8,
|
||||
"right": 8,
|
||||
"bottom": 8
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"$color": "background_color"
|
||||
}
|
||||
],
|
||||
"border": {
|
||||
"corner_radius": 8
|
||||
},
|
||||
"delimiter_style": {
|
||||
"color": "#00000000"
|
||||
}
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "grid_layout",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"items": [
|
||||
{
|
||||
"type": "grid",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 288
|
||||
},
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 370
|
||||
},
|
||||
"margins": {
|
||||
"top": 16
|
||||
},
|
||||
"paddings": {
|
||||
"left": 8,
|
||||
"top": 8,
|
||||
"right": 8,
|
||||
"bottom": 8
|
||||
},
|
||||
"alignment_horizontal": "center",
|
||||
"column_count": 3,
|
||||
"items": [
|
||||
{
|
||||
"type": "grid_element",
|
||||
"row_span": 2,
|
||||
"background_color": "#D098D3"
|
||||
},
|
||||
{
|
||||
"type": "grid_element",
|
||||
"background_color": "#FFCC00"
|
||||
},
|
||||
{
|
||||
"type": "grid_element",
|
||||
"background_color": "#e1bae3"
|
||||
},
|
||||
{
|
||||
"type": "grid_element",
|
||||
"column_span": 2,
|
||||
"background_color": "#ffe066"
|
||||
},
|
||||
{
|
||||
"type": "grid_element",
|
||||
"column_span": 3,
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 200
|
||||
},
|
||||
"content_alignment_vertical": "space-around",
|
||||
"background_color": "#D098D3"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,90 @@
|
||||
{
|
||||
"templates": {
|
||||
"block": {
|
||||
"type": "container",
|
||||
"margins": {
|
||||
"left": 10,
|
||||
"right": 10,
|
||||
"top": 10,
|
||||
"bottom": 10
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "text",
|
||||
"$text": "text",
|
||||
"font_size": 16,
|
||||
"width": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"margins": {
|
||||
"left": 10,
|
||||
"right": 10,
|
||||
"top": 10,
|
||||
"bottom": 10
|
||||
}
|
||||
}
|
||||
],
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#A0FFA0"
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "test",
|
||||
"variables": [
|
||||
{
|
||||
"name": "block1_height",
|
||||
"type": "integer",
|
||||
"value": 0
|
||||
},
|
||||
{
|
||||
"name": "block1_width",
|
||||
"type": "integer",
|
||||
"value": 0
|
||||
}
|
||||
],
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "container",
|
||||
"paddings": {
|
||||
"left": 10,
|
||||
"top": 10,
|
||||
"right": 10,
|
||||
"bottom": 10
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "block",
|
||||
"text": "width = height x 4\nheight = wrap_content",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": "@{block1_height * 4}"
|
||||
},
|
||||
"layout_provider": {
|
||||
"height_variable_name": "block1_height",
|
||||
"width_variable_name": "block1_width"
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "block",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": "@{block1_height * 2}"
|
||||
},
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": "@{block1_width}"
|
||||
},
|
||||
"text": "width = block1_height x 2\nheight = block1_width"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,115 @@
|
||||
{
|
||||
"templates": {
|
||||
"basic_text": {
|
||||
"type": "text",
|
||||
"font_size": 15,
|
||||
"margins": {
|
||||
"top": 12,
|
||||
"bottom": 12,
|
||||
"start": 12,
|
||||
"end": 12
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 10
|
||||
},
|
||||
"paddings": {
|
||||
"top": 10,
|
||||
"bottom": 10,
|
||||
"start": 10,
|
||||
"end": 10
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#600000ff"
|
||||
}
|
||||
],
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"alignment_horizontal": "center",
|
||||
"text_alignment_horizontal": "center"
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "generated_div",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"margins": {
|
||||
"top": 10,
|
||||
"left": 10,
|
||||
"right": 10,
|
||||
"bottom": 10
|
||||
},
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"border": {
|
||||
"stroke": {
|
||||
"color": "#000"
|
||||
}
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "pager",
|
||||
"id": "pager_id",
|
||||
"orientation": "horizontal",
|
||||
"layout_mode":{
|
||||
"type": "fixed",
|
||||
"neighbour_page_width": {
|
||||
"type": "fixed",
|
||||
"value": 10
|
||||
}
|
||||
},
|
||||
"infinite_scroll": true,
|
||||
"items": [
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 1"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 2"
|
||||
},
|
||||
{
|
||||
"type": "basic_text",
|
||||
"text": "Block 3"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "indicator",
|
||||
"pager_id": "pager_id",
|
||||
"inactive_item_color": "#d0d1d9",
|
||||
"active_item_color": "#000000",
|
||||
"alignment_horizontal": "center",
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 30
|
||||
},
|
||||
"width": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"shape": {
|
||||
"type": "rounded_rectangle",
|
||||
"item_width": {
|
||||
"type": "fixed",
|
||||
"value": 10
|
||||
},
|
||||
"item_height": {
|
||||
"type": "fixed",
|
||||
"value": 2
|
||||
},
|
||||
"corner_radius": {
|
||||
"type": "fixed",
|
||||
"value": 2
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,98 @@
|
||||
{
|
||||
"templates": {
|
||||
"text_block": {
|
||||
"type": "text",
|
||||
"border": {
|
||||
"corner_radius": 8,
|
||||
"stroke": {
|
||||
"color": "#ffffff",
|
||||
"width": 2
|
||||
}
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"color": "#0e000000",
|
||||
"type": "solid"
|
||||
}
|
||||
],
|
||||
"font_size": 20,
|
||||
"text_alignment_vertical": "center",
|
||||
"text_alignment_horizontal": "center",
|
||||
"text_color": "#000000",
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 80
|
||||
}
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "sample_card",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"items": [
|
||||
{
|
||||
"type": "tabs",
|
||||
"height": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"paddings": {
|
||||
"left": 16,
|
||||
"right": 16
|
||||
},
|
||||
"margins": {
|
||||
"top": 4,
|
||||
"bottom": 28
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"title": "Tab 1",
|
||||
"div": {
|
||||
"type": "text_block",
|
||||
"text": "Item 0",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"title": "Tab 2",
|
||||
"div": {
|
||||
"type": "text_block",
|
||||
"text": "Item 1",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"title": "Tab 3",
|
||||
"div": {
|
||||
"type": "text_block",
|
||||
"text": "Item 3",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"title": "Tab 4",
|
||||
"div": {
|
||||
"type": "text_block",
|
||||
"text": "Item 4",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,119 @@
|
||||
{
|
||||
"templates": {
|
||||
"text_block": {
|
||||
"type": "text",
|
||||
"border": {
|
||||
"corner_radius": 8,
|
||||
"stroke": {
|
||||
"color": "#ffffff",
|
||||
"width": 2
|
||||
}
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"color": "#0e000000",
|
||||
"type": "solid"
|
||||
}
|
||||
],
|
||||
"font_size": 20,
|
||||
"text_alignment_vertical": "center",
|
||||
"text_alignment_horizontal": "center",
|
||||
"text_color": "#000000",
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 80
|
||||
}
|
||||
},
|
||||
"tabs_preset": {
|
||||
"type": "tabs",
|
||||
"height": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"paddings": {
|
||||
"left": 16,
|
||||
"right": 16
|
||||
},
|
||||
"tab_title_style": {
|
||||
"animation_type": "none",
|
||||
"item_spacing": 5
|
||||
},
|
||||
"margins": {
|
||||
"top": 4,
|
||||
"bottom": 28
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"title": "Tab 1",
|
||||
"div": {
|
||||
"type": "text_block",
|
||||
"text": "Item 0",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"title": "Tab 2",
|
||||
"div": {
|
||||
"type": "text_block",
|
||||
"text": "Item 1",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"title": "Tab 3",
|
||||
"div": {
|
||||
"type": "text_block",
|
||||
"text": "Item 3",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"title": "Tab 4",
|
||||
"div": {
|
||||
"type": "text_block",
|
||||
"text": "Item 4",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "sample_card",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"items": [
|
||||
{
|
||||
"type": "tabs_preset",
|
||||
"tab_title_style": {
|
||||
"animation_type": "slide",
|
||||
"item_spacing": 5
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "tabs_preset",
|
||||
"tab_title_style": {
|
||||
"animation_type": "fade",
|
||||
"item_spacing": 5
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "tabs_preset"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,174 @@
|
||||
{
|
||||
"templates": {
|
||||
"cardContainer": {
|
||||
"type": "container",
|
||||
"border": {
|
||||
"corner_radius": 16,
|
||||
"stroke": {
|
||||
"color": "#aaaaaa",
|
||||
"width": 1
|
||||
}
|
||||
},
|
||||
"margins": {
|
||||
"bottom": 6
|
||||
},
|
||||
"width": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"orientation": "vertical",
|
||||
"paddings": {
|
||||
"top": 12,
|
||||
"bottom": 12,
|
||||
"left": 12,
|
||||
"right": 12
|
||||
}
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "prototypes",
|
||||
"variables": [
|
||||
{
|
||||
"name": "data",
|
||||
"type": "array",
|
||||
"value": [
|
||||
{
|
||||
"style": "only_text",
|
||||
"title": "First text card"
|
||||
},
|
||||
{
|
||||
"style": "only_text",
|
||||
"title": "Second text card"
|
||||
},
|
||||
{
|
||||
"style": "with_image",
|
||||
"title": "Card with image",
|
||||
"image_url": "https://yastatic.net/s3/home/divkit/wombat.jpg"
|
||||
},
|
||||
{
|
||||
"style": "add_button"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "gallery",
|
||||
"orientation": "vertical",
|
||||
"margins": {
|
||||
"top": 10,
|
||||
"start": 10,
|
||||
"end": 10,
|
||||
"bottom": 10
|
||||
},
|
||||
"item_builder": {
|
||||
"type": "prototype",
|
||||
"data": "@{data}",
|
||||
"data_element_name": "item",
|
||||
"prototypes": [
|
||||
{
|
||||
"selector": "@{getStringFromDict(item, 'style') == 'only_text'}",
|
||||
"div": {
|
||||
"type": "cardContainer",
|
||||
"items": [
|
||||
{
|
||||
"type": "text",
|
||||
"text": "@{getStringFromDict(item, 'title')}",
|
||||
"font_size": 16,
|
||||
"margins": {
|
||||
"bottom": 4
|
||||
},
|
||||
"width": {
|
||||
"type": "wrap_content"
|
||||
}
|
||||
}
|
||||
],
|
||||
"width": {
|
||||
"type": "wrap_content"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"selector": "@{getStringFromDict(item, 'style') == 'with_image'}",
|
||||
"div": {
|
||||
"type": "cardContainer",
|
||||
"items": [
|
||||
{
|
||||
"type": "image",
|
||||
"image_url": "@{getStringFromDict(item, 'image_url')}",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
},
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "text",
|
||||
"text": "@{getStringFromDict(item, 'title')}",
|
||||
"text_alignment_horizontal": "center",
|
||||
"font_size": 16,
|
||||
"margins": {
|
||||
"left": 4
|
||||
}
|
||||
}
|
||||
],
|
||||
"width": {
|
||||
"type": "wrap_content"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"selector": "@{getStringFromDict(item, 'style') == 'add_button'}",
|
||||
"div": {
|
||||
"type": "cardContainer",
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#3000ffff"
|
||||
}
|
||||
],
|
||||
"items": [
|
||||
{
|
||||
"type": "text",
|
||||
"text": "Add item",
|
||||
"font_size": 16,
|
||||
"width": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"paddings": {
|
||||
"start": 13,
|
||||
"end": 13,
|
||||
"top": 13,
|
||||
"bottom": 13
|
||||
},
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "add_card",
|
||||
"typed": {
|
||||
"type": "array_insert_value",
|
||||
"variable_name": "data",
|
||||
"value": {
|
||||
"type": "dict",
|
||||
"value": {
|
||||
"style": "only_text",
|
||||
"title": "Additional card"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,116 @@
|
||||
{
|
||||
"templates": {
|
||||
"button": {
|
||||
"type": "text",
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 48
|
||||
},
|
||||
"margins": {
|
||||
"left": 16,
|
||||
"right": 16,
|
||||
"bottom": 16
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 16
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"$color": "background_color"
|
||||
}
|
||||
],
|
||||
"font_size": 14,
|
||||
"font_weight": "medium",
|
||||
"text_alignment_vertical": "center",
|
||||
"text_alignment_horizontal": "center"
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "sample_card",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"margins": {
|
||||
"top": 24,
|
||||
"bottom": 24
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "button",
|
||||
"background_color": "#00B341",
|
||||
"text": "Fade",
|
||||
"text_color": "#000000",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "fade_button_press",
|
||||
"url": "div-action://animation/fade"
|
||||
}
|
||||
],
|
||||
"action_animation": {
|
||||
"name": "fade",
|
||||
"start_value": 1.0,
|
||||
"end_value": 0.4,
|
||||
"duration": 500,
|
||||
"interpolator": "ease_in_out"
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "button",
|
||||
"background_color": "#0077FF",
|
||||
"text_color": "#ffffff",
|
||||
"text": "Scale",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "scale_button_press",
|
||||
"url": "div-action://animation/scale"
|
||||
}
|
||||
],
|
||||
"action_animation": {
|
||||
"name": "scale",
|
||||
"start_value": 1.0,
|
||||
"end_value": 0.4,
|
||||
"duration": 500,
|
||||
"interpolator": "ease_in_out"
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "button",
|
||||
"background_color": "#FFCC00",
|
||||
"text": "Set",
|
||||
"text_color": "#000000",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "set_button_press",
|
||||
"url": "div-action://animation/set"
|
||||
}
|
||||
],
|
||||
"action_animation": {
|
||||
"name": "set",
|
||||
"items": [
|
||||
{
|
||||
"name": "fade",
|
||||
"start_value": 1.0,
|
||||
"end_value": 0.2,
|
||||
"duration": 300,
|
||||
"interpolator": "ease_in_out"
|
||||
},
|
||||
{
|
||||
"name": "scale",
|
||||
"start_value": 1.0,
|
||||
"end_value": 0.5,
|
||||
"duration": 500,
|
||||
"interpolator": "ease_in_out"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,205 @@
|
||||
{
|
||||
"templates": {
|
||||
"case_container": {
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"paddings": {
|
||||
"left": 16,
|
||||
"top": 16,
|
||||
"right": 16,
|
||||
"bottom": 16
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"$color": "background_color"
|
||||
}
|
||||
]
|
||||
},
|
||||
"title": {
|
||||
"type": "text",
|
||||
"font_size": 24,
|
||||
"font_weight": "bold",
|
||||
"text_alignment_horizontal": "center",
|
||||
"text_alignment_vertical": "center",
|
||||
"text_color": "#586E75"
|
||||
},
|
||||
"button": {
|
||||
"type": "text",
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 48
|
||||
},
|
||||
"paddings": {
|
||||
"left": 8,
|
||||
"top": 8,
|
||||
"right": 8,
|
||||
"bottom": 8
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"$color": "background_color"
|
||||
}
|
||||
],
|
||||
"border": {
|
||||
"corner_radius": 8
|
||||
},
|
||||
"font_size": 20,
|
||||
"font_weight": "medium",
|
||||
"text_alignment_horizontal": "center",
|
||||
"text_alignment_vertical": "center",
|
||||
"text_color": "#FDF6E3"
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "variable_animators",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "case_container",
|
||||
"background_color": "#FDF6E3",
|
||||
"items": [
|
||||
{
|
||||
"type": "title",
|
||||
"margins": {
|
||||
"bottom": 16
|
||||
},
|
||||
"text": "Spinner animator"
|
||||
},
|
||||
{
|
||||
"id": "spinner",
|
||||
"type": "image",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 48
|
||||
},
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 48
|
||||
},
|
||||
"margins": {
|
||||
"bottom": 16
|
||||
},
|
||||
"image_url": "https://yastatic.net/s3/home/divkit/spinner.png",
|
||||
"tint_color": "@{tint_color}",
|
||||
"transform": {
|
||||
"rotation": "@{rotation_angle}"
|
||||
},
|
||||
"alignment_horizontal": "center",
|
||||
"variables": [
|
||||
{
|
||||
"name": "rotation_angle",
|
||||
"type": "number",
|
||||
"value": 0.0
|
||||
},
|
||||
{
|
||||
"name": "tint_color",
|
||||
"type": "color",
|
||||
"value": "#268BD2"
|
||||
}
|
||||
],
|
||||
"animators": [
|
||||
{
|
||||
"type": "number_animator",
|
||||
"id": "rotation_animator",
|
||||
"variable_name": "rotation_angle",
|
||||
"duration": 1000,
|
||||
"start_value": 0,
|
||||
"end_value": 360,
|
||||
"interpolator": "ease_in_out",
|
||||
"$cancel_actions": "rotation_animator_cancel_actions"
|
||||
},
|
||||
{
|
||||
"type": "color_animator",
|
||||
"id": "tint_color_animator",
|
||||
"variable_name": "tint_color",
|
||||
"duration": 2000,
|
||||
"start_value": "#268BD2",
|
||||
"end_value": "#D33682",
|
||||
"$cancel_actions": "tint_color_animator_cancel_actions"
|
||||
}
|
||||
],
|
||||
"rotation_animator_cancel_actions": [
|
||||
{
|
||||
"log_id": "reset_rotation_animation",
|
||||
"url": "div-action://set_variable?name=rotation_angle&value=0"
|
||||
}
|
||||
],
|
||||
"tint_color_animator_cancel_actions": [
|
||||
{
|
||||
"log_id": "reset_tint_color_animation",
|
||||
"url": "div-action://set_variable?name=tint_color&value=%23268BD2"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "container",
|
||||
"orientation": "horizontal",
|
||||
"items": [
|
||||
{
|
||||
"type": "button",
|
||||
"margins": {
|
||||
"right": 16
|
||||
},
|
||||
"background_color": "#2AA198",
|
||||
"text": "Start",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "start_rotation_animation",
|
||||
"scope_id": "spinner",
|
||||
"typed": {
|
||||
"type": "animator_start",
|
||||
"animator_id": "rotation_animator",
|
||||
"direction": "normal",
|
||||
"repeat_count": {
|
||||
"type": "infinity"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"log_id": "start_tint_color_animation",
|
||||
"scope_id": "spinner",
|
||||
"typed": {
|
||||
"type": "animator_start",
|
||||
"animator_id": "tint_color_animator",
|
||||
"direction": "alternate",
|
||||
"repeat_count": {
|
||||
"type": "infinity"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "button",
|
||||
"background_color": "#CB4B16",
|
||||
"text": "Stop",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "stop_rotation_animation",
|
||||
"scope_id": "spinner",
|
||||
"typed": {
|
||||
"type": "animator_stop",
|
||||
"animator_id": "rotation_animator"
|
||||
}
|
||||
},
|
||||
{
|
||||
"log_id": "stop_tint_color_animation",
|
||||
"scope_id": "spinner",
|
||||
"typed": {
|
||||
"type": "animator_stop",
|
||||
"animator_id": "tint_color_animator"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,151 @@
|
||||
{
|
||||
"templates": {
|
||||
"button": {
|
||||
"type": "text",
|
||||
"paddings": {
|
||||
"left": 16,
|
||||
"top": 16,
|
||||
"right": 16,
|
||||
"bottom": 16
|
||||
},
|
||||
"margins": {
|
||||
"left": 24,
|
||||
"right": 24
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 8
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#0E000000"
|
||||
}
|
||||
],
|
||||
"font_size": 14,
|
||||
"font_weight": "medium",
|
||||
"text_alignment_vertical": "center",
|
||||
"text_alignment_horizontal": "center",
|
||||
"text_color": "#000000"
|
||||
},
|
||||
"in_out_transition_demo_block": {
|
||||
"type": "text",
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 88
|
||||
},
|
||||
"margins": {
|
||||
"left": 24,
|
||||
"right": 24,
|
||||
"bottom": 8
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 16
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#3F28C3"
|
||||
}
|
||||
],
|
||||
"text_color": "#ffffff",
|
||||
"font_size": 14,
|
||||
"text_alignment_vertical": "center",
|
||||
"text_alignment_horizontal": "center"
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"variables": [
|
||||
{
|
||||
"name": "change_state",
|
||||
"type": "string",
|
||||
"value": "none"
|
||||
},
|
||||
{
|
||||
"name": "set_state",
|
||||
"type": "string",
|
||||
"value": "visible"
|
||||
}
|
||||
],
|
||||
"variable_triggers": [
|
||||
{
|
||||
"condition": "@{change_state == 'set' && set_state == 'visible'}",
|
||||
"mode": "on_variable",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "update change_state flag",
|
||||
"url": "div-action://set_variable?name=change_state&value=none"
|
||||
},
|
||||
{
|
||||
"log_id": "update change_state flag",
|
||||
"url": "div-action://set_variable?name=set_state&value=invisible"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"condition": "@{change_state == 'set' && set_state == 'invisible'}",
|
||||
"mode": "on_variable",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "update change_state flag",
|
||||
"url": "div-action://set_variable?name=change_state&value=none"
|
||||
},
|
||||
{
|
||||
"log_id": "update change_state flag",
|
||||
"url": "div-action://set_variable?name=set_state&value=visible"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"log_id": "sample_card",
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"margins": {
|
||||
"top": 24,
|
||||
"bottom": 24
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "in_out_transition_demo_block",
|
||||
"id": "set_in_out",
|
||||
"text": "Animated item",
|
||||
"visibility": "@{set_state}",
|
||||
"transition_out": {
|
||||
"type": "set",
|
||||
"items": [
|
||||
{
|
||||
"type": "fade",
|
||||
"duration": 1000
|
||||
},
|
||||
{
|
||||
"type": "scale",
|
||||
"duration": 1000
|
||||
}
|
||||
]
|
||||
},
|
||||
"transition_in": {
|
||||
"type": "slide",
|
||||
"edge": "right",
|
||||
"duration": 1000
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "button",
|
||||
"alignment_horizontal": "center",
|
||||
"text": "Run",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "set_state",
|
||||
"url": "div-action://set_variable?name=change_state&value=set"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,228 @@
|
||||
{
|
||||
"templates": {
|
||||
"image_block": {
|
||||
"type": "image",
|
||||
"image_url": "https://yastatic.net/s3/home/divkit/samples/slide_04.jpeg",
|
||||
"border": {
|
||||
"corner_radius": 18
|
||||
}
|
||||
},
|
||||
"button": {
|
||||
"type": "text",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"height": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"paddings": {
|
||||
"left": 16,
|
||||
"top": 16,
|
||||
"right": 16,
|
||||
"bottom": 16
|
||||
},
|
||||
"margins": {
|
||||
"left": 24,
|
||||
"right": 24
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 8
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#0E000000"
|
||||
}
|
||||
],
|
||||
"font_size": 14,
|
||||
"font_weight": "medium",
|
||||
"text_alignment_vertical": "center",
|
||||
"text_alignment_horizontal": "center",
|
||||
"text_color": "#000000"
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "sample_card",
|
||||
"variables": [
|
||||
{
|
||||
"name": "change_state",
|
||||
"type": "boolean",
|
||||
"value": false
|
||||
},
|
||||
{
|
||||
"name": "state",
|
||||
"type": "boolean",
|
||||
"value": false
|
||||
}
|
||||
],
|
||||
"variable_triggers": [
|
||||
{
|
||||
"condition": "@{change_state && state}",
|
||||
"mode": "on_variable",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "update change_state flag",
|
||||
"url": "div-action://set_variable?name=change_state&value=false"
|
||||
},
|
||||
{
|
||||
"log_id": "update change_state flag",
|
||||
"url": "div-action://set_variable?name=state&value=false"
|
||||
},
|
||||
{
|
||||
"log_id": "change state",
|
||||
"url": "div-action://set_state?state_id=0/transition_change_demo_state/state1"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"condition": "@{change_state && !state}",
|
||||
"mode": "on_variable",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "update change_state flag",
|
||||
"url": "div-action://set_variable?name=change_state&value=false"
|
||||
},
|
||||
{
|
||||
"log_id": "update state variable",
|
||||
"url": "div-action://set_variable?name=state&value=true"
|
||||
},
|
||||
{
|
||||
"log_id": "change state",
|
||||
"url": "div-action://set_state?state_id=0/transition_change_demo_state/state2"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "container",
|
||||
"orientation": "vertical",
|
||||
"margins": {
|
||||
"top": 24,
|
||||
"bottom": 24
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "container",
|
||||
"orientation": "overlap",
|
||||
"margins": {
|
||||
"left": 16,
|
||||
"right": 16,
|
||||
"bottom": 16
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "container",
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#CDE3EF"
|
||||
}
|
||||
],
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"height": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 18
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "text",
|
||||
"text": "Hidden text",
|
||||
"text_alignment_horizontal": "center",
|
||||
"font_size": 24,
|
||||
"margins": {
|
||||
"top": 30
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "text",
|
||||
"text": "That was revealed",
|
||||
"alignment_horizontal": "end",
|
||||
"alignment_vertical": "bottom",
|
||||
"text_alignment_horizontal": "center",
|
||||
"font_size": 24,
|
||||
"margins": {
|
||||
"bottom": 30,
|
||||
"end": 30
|
||||
},
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 95
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "state",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 250
|
||||
},
|
||||
"id": "transition_change_demo_state",
|
||||
"states": [
|
||||
{
|
||||
"state_id": "state1",
|
||||
"div": {
|
||||
"type": "image_block",
|
||||
"id": "image",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"height": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"transition_change": {
|
||||
"type": "change_bounds",
|
||||
"duration": 1000
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"state_id": "state2",
|
||||
"div": {
|
||||
"type": "image_block",
|
||||
"id": "image",
|
||||
"alignment_horizontal": "left",
|
||||
"alignment_vertical": "bottom",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
},
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
},
|
||||
"transition_change": {
|
||||
"type": "change_bounds",
|
||||
"duration": 1000
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "button",
|
||||
"alignment_horizontal": "center",
|
||||
"text": "Run",
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "set_state1",
|
||||
"url": "div-action://set_variable?name=change_state&value=true"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,174 @@
|
||||
{
|
||||
"templates": {
|
||||
"cardContainer": {
|
||||
"type": "container",
|
||||
"border": {
|
||||
"corner_radius": 16,
|
||||
"stroke": {
|
||||
"color": "#aaaaaa",
|
||||
"width": 1
|
||||
}
|
||||
},
|
||||
"margins": {
|
||||
"bottom": 6
|
||||
},
|
||||
"width": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"orientation": "vertical",
|
||||
"paddings": {
|
||||
"top": 12,
|
||||
"bottom": 12,
|
||||
"left": 12,
|
||||
"right": 12
|
||||
}
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "prototypes",
|
||||
"variables": [
|
||||
{
|
||||
"name": "data",
|
||||
"type": "array",
|
||||
"value": [
|
||||
{
|
||||
"style": "only_text",
|
||||
"title": "First text card"
|
||||
},
|
||||
{
|
||||
"style": "only_text",
|
||||
"title": "Second text card"
|
||||
},
|
||||
{
|
||||
"style": "with_image",
|
||||
"title": "Card with image",
|
||||
"image_url": "https://yastatic.net/s3/home/divkit/wombat.jpg"
|
||||
},
|
||||
{
|
||||
"style": "add_button"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "gallery",
|
||||
"orientation": "vertical",
|
||||
"margins": {
|
||||
"top": 10,
|
||||
"start": 10,
|
||||
"end": 10,
|
||||
"bottom": 10
|
||||
},
|
||||
"item_builder": {
|
||||
"type": "prototype",
|
||||
"data": "@{data}",
|
||||
"data_element_name": "item",
|
||||
"prototypes": [
|
||||
{
|
||||
"selector": "@{getStringFromDict(item, 'style') == 'only_text'}",
|
||||
"div": {
|
||||
"type": "cardContainer",
|
||||
"items": [
|
||||
{
|
||||
"type": "text",
|
||||
"text": "@{getStringFromDict(item, 'title')}",
|
||||
"font_size": 16,
|
||||
"margins": {
|
||||
"bottom": 4
|
||||
},
|
||||
"width": {
|
||||
"type": "wrap_content"
|
||||
}
|
||||
}
|
||||
],
|
||||
"width": {
|
||||
"type": "wrap_content"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"selector": "@{getStringFromDict(item, 'style') == 'with_image'}",
|
||||
"div": {
|
||||
"type": "cardContainer",
|
||||
"items": [
|
||||
{
|
||||
"type": "image",
|
||||
"image_url": "@{getStringFromDict(item, 'image_url')}",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
},
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "text",
|
||||
"text": "@{getStringFromDict(item, 'title')}",
|
||||
"text_alignment_horizontal": "center",
|
||||
"font_size": 16,
|
||||
"margins": {
|
||||
"left": 4
|
||||
}
|
||||
}
|
||||
],
|
||||
"width": {
|
||||
"type": "wrap_content"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"selector": "@{getStringFromDict(item, 'style') == 'add_button'}",
|
||||
"div": {
|
||||
"type": "cardContainer",
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#3000ffff"
|
||||
}
|
||||
],
|
||||
"items": [
|
||||
{
|
||||
"type": "text",
|
||||
"text": "Add item",
|
||||
"font_size": 16,
|
||||
"width": {
|
||||
"type": "wrap_content"
|
||||
},
|
||||
"paddings": {
|
||||
"start": 13,
|
||||
"end": 13,
|
||||
"top": 13,
|
||||
"bottom": 13
|
||||
},
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "add_card",
|
||||
"typed": {
|
||||
"type": "array_insert_value",
|
||||
"variable_name": "data",
|
||||
"value": {
|
||||
"type": "dict",
|
||||
"value": {
|
||||
"style": "only_text",
|
||||
"title": "Additional card"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,215 @@
|
||||
{
|
||||
"templates": {
|
||||
"block": {
|
||||
"type": "container",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 100
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 50
|
||||
},
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 100
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"$color": "background_color"
|
||||
}
|
||||
]
|
||||
},
|
||||
"color_input": {
|
||||
"type": "input",
|
||||
"font_size": 16,
|
||||
"margins": {
|
||||
"top": 10
|
||||
},
|
||||
"text_alignment_horizontal": "center",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 4,
|
||||
"stroke": {
|
||||
"color": "#000"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"card": {
|
||||
"log_id": "generated_div",
|
||||
"variables": [
|
||||
{
|
||||
"name": "input_1",
|
||||
"type": "string",
|
||||
"value": "00ff00"
|
||||
},
|
||||
{
|
||||
"name": "input_2",
|
||||
"type": "string",
|
||||
"value": "0000ff"
|
||||
},
|
||||
{
|
||||
"name": "input_3",
|
||||
"type": "string",
|
||||
"value": "ff0000"
|
||||
},
|
||||
{
|
||||
"name": "color_1",
|
||||
"type": "color",
|
||||
"value": "#5500ff00"
|
||||
},
|
||||
{
|
||||
"name": "color_2",
|
||||
"type": "color",
|
||||
"value": "#550000ff"
|
||||
},
|
||||
{
|
||||
"name": "color_3",
|
||||
"type": "color",
|
||||
"value": "#55ff0000"
|
||||
}
|
||||
],
|
||||
"states": [
|
||||
{
|
||||
"state_id": 0,
|
||||
"div": {
|
||||
"type": "container",
|
||||
"width": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"height": {
|
||||
"type": "match_parent"
|
||||
},
|
||||
"content_alignment_horizontal": "center",
|
||||
"content_alignment_vertical": "center",
|
||||
"items": [
|
||||
{
|
||||
"margins": {
|
||||
"left": 10,
|
||||
"right": 10
|
||||
},
|
||||
"type": "container",
|
||||
"orientation": "overlap",
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
},
|
||||
"height": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"type": "block",
|
||||
"background_color": "@{color_1}",
|
||||
"alignment_horizontal": "center"
|
||||
},
|
||||
{
|
||||
"type": "block",
|
||||
"background_color": "@{color_2}",
|
||||
"alignment_horizontal": "end",
|
||||
"alignment_vertical": "bottom"
|
||||
},
|
||||
{
|
||||
"type": "block",
|
||||
"background_color": "@{color_3}",
|
||||
"alignment_horizontal": "start",
|
||||
"alignment_vertical": "bottom"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "color_input",
|
||||
"text_variable": "input_1",
|
||||
"margins": {
|
||||
"top": 40
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "color_input",
|
||||
"text_variable": "input_2"
|
||||
},
|
||||
{
|
||||
"type": "color_input",
|
||||
"text_variable": "input_3"
|
||||
},
|
||||
{
|
||||
"type": "text",
|
||||
"text": "Mix!",
|
||||
"text_alignment_horizontal": "center",
|
||||
"font_size": 20,
|
||||
"margins": {
|
||||
"top": 10
|
||||
},
|
||||
"background": [
|
||||
{
|
||||
"type": "solid",
|
||||
"color": "#600000ff"
|
||||
}
|
||||
],
|
||||
"width": {
|
||||
"type": "fixed",
|
||||
"value": 150
|
||||
},
|
||||
"border": {
|
||||
"corner_radius": 4
|
||||
},
|
||||
"functions": [
|
||||
{
|
||||
"name": "reduce_alpha",
|
||||
"arguments": [
|
||||
{
|
||||
"name": "init_color",
|
||||
"type": "string"
|
||||
}
|
||||
],
|
||||
"return_type": "color",
|
||||
"body": "@{toColor('#55@{init_color}')}"
|
||||
}
|
||||
],
|
||||
"actions": [
|
||||
{
|
||||
"log_id": "set_color_1",
|
||||
"typed":{
|
||||
"type": "set_variable",
|
||||
"variable_name": "color_1",
|
||||
"value": {
|
||||
"type": "color",
|
||||
"value": "@{reduce_alpha(input_1)}"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"log_id": "set_color_2",
|
||||
"typed":{
|
||||
"type": "set_variable",
|
||||
"variable_name": "color_2",
|
||||
"value": {
|
||||
"type": "color",
|
||||
"value": "@{reduce_alpha(input_2)}"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"log_id": "set_color_3",
|
||||
"typed":{
|
||||
"type": "set_variable",
|
||||
"variable_name": "color_3",
|
||||
"value": {
|
||||
"type": "color",
|
||||
"value": "@{reduce_alpha(input_3)}"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user