Sailfish OS
  • Info
  • User Experience
  • Cases
  • Community
  • Developers
  • Contact
  • Get Sailfish OS
Select Page
  • Info
  • User Experience
  • Cases
  • Community
  • Developers
  • Contact
  • Get Sailfish OS

API Documentation

Documentation for developing SailfishOS applications
  • API Documentation
  • Libsailfishapp
  • Sailfish Silica
    • Documentation
    • Icon Reference
  • Sailfish Components
    • Sailfish Accounts
    • Sailfish Bluetooth
    • Sailfish Contacts
    • Sailfish Crypto
    • Sailfish Gallery
    • Sailfish Media
    • Sailfish Pickers
    • Sailfish Secrets
    • Sailfish Share
    • Sailfish Telephony
    • Sailfish Webview
    • Amber Web Authorization
    • Amber MPRIS
  • Nemo QML Plugins
    • Configuration
    • Contacts
    • D-Bus
    • Keepalive
    • Notifications
    • Thumbnailer
  • Sailfish Middleware
    • MDM Framework
    • MDM Policy Framework
    • User Manager Daemon
  • API Documentation
  • Libsailfishapp
  • Sailfish Silica
    • Documentation
    • Icon Reference
  • Sailfish Components
    • Sailfish Accounts
    • Sailfish Bluetooth
    • Sailfish Contacts
    • Sailfish Crypto
    • Sailfish Gallery
    • Sailfish Media
    • Sailfish Pickers
    • Sailfish Secrets
    • Sailfish Share
    • Sailfish Telephony
    • Sailfish Webview
    • Amber Web Authorization
    • Amber MPRIS
  • Nemo QML Plugins
    • Configuration
    • Contacts
    • D-Bus
    • Keepalive
    • Notifications
    • Thumbnailer
  • Sailfish Middleware
    • MDM Framework
    • MDM Policy Framework
    • User Manager Daemon

Contents

  • Properties
  • Detailed Description

OpacityRampEffect QML Type

A shader effect that applies an opacity fade gradient More...

Import Statement: import Sailfish.Silica 1.0
  • List of all members, including inherited members

Properties

  • direction : enumeration
  • offset : real
  • slope : real
  • sourceItem : Item

Detailed Description

OpacityRampEffect linearly decreases the opacity of an item in a specified direction.

The example below fades the text from top to bottom:

 import QtQuick 2.2
 import Sailfish.Silica 1.0

 Item {
     Label {
         id: helloText
         font.pixelSize: Theme.fontSizeExtraLarge
         text: "Hello"
     }
     OpacityRampEffect {
         sourceItem: helloText
         direction: OpacityRamp.TopToBottom
     }
 }

Property Documentation

direction : enumeration

This direction property determines the direction of the fade:

  • OpacityRamp.LeftToRight
  • OpacityRamp.RightToLeft
  • OpacityRamp.TopToBottom
  • OpacityRamp.BottomToTop
  • OpacityRamp.BothSides

The default value is OpacityRamp.LeftToRight.


offset : real

Specifies the distance from the starting edge to begin the ramp down. For example, setting offset: 0.75 with direction: OpacityRamp.LeftToRight will begin fading at 75% of the width of the sourceItem.

The default value is 0.5.


slope : real

Specifies the rate at which opacity is reduced. A value of 1.0 will ramp the opacity down to 0 over the full width of the sourceItem. A value of 2.0 will reduce the opacity to 0 over half the width of the sourceItem.

The default value is 2.0.


sourceItem : Item

Specifies the Item to which the effect is applied. The OpacityRampEffect cannot be a child of the sourceItem.


  • Legal
  • Contact Us
  • Jolla Mobile Ltd © 2025

  • Facebook
  • Twitter
  • Mastodon
  • YouTube
  • LinkedIn