Navigation

    ScreenPlayLogo
    • Register
    • Login
    • Search
    • Recent
    • Popular
    • Gitter
    • Reddit
    • Source Code

    How to create a Wallpaper step by step guide

    General Discussion
    1
    1
    35
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • Kelteseth
      Kelteseth last edited by Kelteseth

      The wizard for creating wallpaper is not in place yet but you can still create one simply by creating a project.json https://kelteseth.gitlab.io/ScreenPlayDocs/project/project/ Project setup:

      1. Create a new folder inside your save loctation (C:\Program Files (x86)\Steam\steamapps\workshop\content\672870) efed4d61-397c-4453-8490-93635be213c7-grafik.png

      2. Create a text file and call it project.json (not project.json.txt)

      3. Past this into it project.json

      {
          "description": "This is a description",
          "file": "file.webm",
          "preview": "preview.jpg",
          "previewGIF": "preview.gif",
          "previewWEBM": "preview.webm",
          "title": "My title",
          "type": "videoWallpaper"
      }
      

      Change the content to your liking. For example there are different types of wallpaper: https://kelteseth.gitlab.io/ScreenPlayDocs/project/project/#wallpaper-filetype-options

      // A QML wallpaper:
      "file": "main.qml",
      "type": "qmlWallpaper"
      
      // A HTML wallpaper:
      "file": "main.html",
      "type": "htmlWallpaper"
      
      // A Video wallpaper:
      "file": "video.webm",
      "type": "videoWallpaper"
      
      
      1. Now you can refresh (F5 or pull to refresh) at the Installed tab. 1473094a-07bb-4f93-aa35-b6c322bf4eb0-grafik.png

      Change the content to your liking, for example:

      7dca1e00-8932-450a-aa50-49dc835ad014-grafik.png

      dec03e89-3fe8-4358-a89a-ec8610b6d011-grafik.png project.json

      {
          "description": "Quiet particles",
          "file": "main.qml",
          "monetization": false,
          "preview": "preview.png",
          "previewGIF": "preview.gif",
          "properties": {
              "Attractor": {
                  "attStrength": {
                      "from": 0,
                      "stepSize": 100,
                      "to": 100000,
                      "type": "slider",
                      "value": 8000000
                  }
              },
              "Emitter": {
                  "emitRate": {
                      "from": 0,
                      "stepSize": 1,
                      "to": 2500,
                      "type": "slider",
                      "value": 25
                  },
                  "endSize": {
                      "from": 0,
                      "stepSize": 1,
                      "to": 100,
                      "type": "slider",
                      "value": 18
                  },
                  "isEnabled": {
                      "type": "bool",
                      "value": true
                  },
                  "lifeSpan": {
                      "from": 0,
                      "stepSize": 100,
                      "to": 10000,
                      "type": "slider",
                      "value": 5000
                  },
                  "sizeVariation": {
                      "from": 0,
                      "stepSize": 1,
                      "to": 10,
                      "type": "slider",
                      "value": 4
                  }
              },
              "ImageParticle": {
                  "color": {
                      "type": "color",
                      "value": "#ffffff"
                  },
                  "imgOpacity": {
                      "from": 0,
                      "stepSize":" .05",
                      "to": 1,
                      "type": "slider",
                      "value": 1
                  },
                  "source": {
                      "formats": "*.png,*.jpg",
                      "type": "file",
                      "value": "backgroundGlow.png"
                  }
              }
          },
          "tags": [
              "particles"
          ],
          "title": "QML particles",
          "type": "qmlWallpaper"
      }
      
      

      main.qml

      import QtQuick 2.9
      import QtGraphicalEffects 1.0
      import QtQuick.Particles 2.0
      
      Item {
          id: root
          anchors.fill: parent
      
          property int attStrength: 8000000
          //Emitter
          property bool isEnabled: true
          property int emitRate: 25
          property int lifeSpan: 5000
          property int size: 4
          property int endSize: 8
          property int sizeVariation: 4
      
          //Image
          property real imgOpacity: .75
      
      
          LinearGradient {
              id: gradient
              anchors.fill: parent
              cached: true
              start: Qt.point(0, 0)
              end: Qt.point(gradient.width, gradient.height)
              gradient: Gradient {
                  GradientStop {
                      position: 0.0
                      color: "#199EF1"
                  }
                  GradientStop {
                      position: 1.0
                      color: "#092E6C"
                  }
              }
          }
      
          Item {
              anchors.fill: parent
      
              MouseArea {
                  id: ma
                  anchors.fill: parent
                  hoverEnabled: true
                  Component.onCompleted: {
                      attractor.pointX = parent.width * .5
                      attractor.pointY = 0
                  }
      
                  onPressed: {
                      //attractor.enabled = true
                  }
                  onPositionChanged: {
                      attractor.pointX = mouseX
                      print()
                      attractor.pointY = mouseY
                      if (ma.pressed) {
                      }
                  }
                  onReleased: {
                      //attractor.enabled = false
                  }
              }
      
              Attractor {
                  id: attractor
                  system: particleSystem
                  affectedParameter: Attractor.Acceleration
                  strength: root.attStrength
                  proportionalToDistance: Attractor.InverseQuadratic
                  anchors{
                      top:parent.top
                      topMargin: 100
                      horizontalCenter: parent.horizontalCenter
      
                  }
              }
      
              ParticleSystem {
                  id: particleSystem
              }
      
              Emitter {
                  id: emitter
                  enabled: root.isEnabled
                  anchors {
                      horizontalCenter: parent.horizontalCenter
                      bottom: parent.bottom
                  }
      
                  width: parent.width
                  height: parent.height * .5
                  system: particleSystem
                  emitRate: root.emitRate
                  lifeSpan: root.lifeSpan
                  lifeSpanVariation: 1000
                  size: root.size
                  endSize: root.endSize
                  sizeVariation: root.sizeVariation
                  velocity: AngleDirection {
                      angle: -90
                      magnitude: 50
                      magnitudeVariation: 25
                      angleVariation: 10
                  }
              }
      
              ImageParticle {
                  height: 16
                  width: 16
                  source: "dot.png"
                  system: particleSystem
                  opacity: root.imgOpacity
              }
      
              Image {
                  id: bgGlow
                  width: parent.width * .75
                  height: width
                  opacity: .3
                  source: "backgroundGlow.png"
                  anchors {
                      horizontalCenter: parent.horizontalCenter
                      bottom: parent.bottom
                      bottomMargin: -width * .65
                  }
                  SequentialAnimation on opacity {
                      loops: Animation.Infinite
      
                      OpacityAnimator {
                          from: 0
                          to: .3
                          duration: 100000
                      }
                      OpacityAnimator {
                          from: .4
                          to: 0
                          duration: 100000
                      }
                  }
              }
          }
      }
      
      
      1 Reply Last reply Reply Quote 1
      • First post
        Last post

      ✨News

      πŸ‘ Vote for ScreenPlay

      πŸ±β€πŸ Godot Engine 3D Wallpaper Guide

      πŸ€– Bulk video import via Handbrake

      Popular Topics

      Get ScreenPlay via Steam