How do you set that the image is stretch to the full screen no matter what size the phone is?


Which should I use? and what is the setting?

Currently the easiest way to setup a full-sized image on the screen is creating a custom component to adjust the width and height of the element on tick.

Here’s a custom component that should do the trick:

import * as ecs from '@8thwall/ecs'

ecs.registerComponent({
  name: 'bg-image',
  schema: {
  },
  schemaDefaults: {
  },
  data: {
  },
  add: (world, component) => {
  },
  tick: (world, component) => {
    ecs.Ui.mutate(world, component.eid, (cursor) => {
      cursor.width = window.innerWidth
      cursor.height = window.innerHeight
    })
  },
  remove: (world, component) => {
  },
})

Here’s how it should look when it’s applied:

Thanks! it’s perfect