used for article titled "Jetpack Compose Anchored Draggable Item in MotionLayout". We have the start and end point the same here. This is just to display the initial still UI

motion_scene1.json5

{
  ConstraintSets: {
    start: {
      headerImage: {
        width: "spread",
        height: 250,
        top: ['parent', 'top'],
        start: ['parent', 'start'],
        end: ['parent', 'end'],
        translationY: 0,
        alpha: 1
      },
      title: {
        width: 'spread',
        height: 'wrap',
        start: ['parent', 'start'],
        end: ['parent', 'end'],
        top: ['parent','top', 200],
      },
      titleDivider: {
        width: 'spread',
        height: 'wrap',
        start: ['parent', 'start'],
        end: ['parent', 'end'],
        top: ['title','bottom'],
      },
      subTitle: {
        width: 'spread',
        height: 'wrap',
        start: ['parent', 'start'],
        end: ['parent', 'end'],
        top: ['titleDivider','bottom'],
      },
      subTitleDivider: {
        width: 'spread',
        height: 'wrap',
        start: ['parent', 'start'],
        end: ['parent', 'end'],
        top: ['subTitle', 'bottom'],
      },
      date: {
        width: 'spread',
        height: 'wrap',
        start: ['parent', 'start'],
        end: ['parent', 'end'],
        top: ['subTitleDivider', 'bottom'],
      },
      actions: {
        width: 'spread',
        height: 'wrap',
        start: ['parent', 'start', 16],
        end: ['parent', 'end', 16],
        top: ['date','bottom']
      },
      text: {
        width: 'spread',
        height: 'spread',
        start: ['parent', 'start', 16],
        end: ['parent', 'end', 16],
        top: ['actions', 'bottom', 16],
        bottom: ['parent', 'bottom']
      }
    },
    end: {
      ...
    }
  }
}