victordiaz / PHONK

PHONK is a coding playground for new and old Android devices
https://phonk.app
GNU General Public License v3.0
463 stars 25 forks source link

Draft: Theming and Styling views #39

Closed victordiaz closed 4 years ago

victordiaz commented 4 years ago

This API is added now to style the widgets (you can try it out already). Is there any property that is interesting to add?

Example:

// change the main script theme
ui.setTheme({
  background: '#000055',
  primary: '#FF0000',
  secondary: '#00FF00',
  textPrimary: '#FFFF00',
  animationOnViewAdd: true
})

// get the theme properties
console.log(ui.getTheme())

ui.addTitle(app.name)

var slider = ui.addSlider(0.1, 0.5, 0.8, 0.2).mode('drag').onChange(function (e) {
  console.log(e)
})

// get all the slider properties
console.log(slider.getProps())

// change individual properties of a widget
slider.props.slider = "#00FF00"

var btn = ui.addButton('Click me', 0.1, 0.2, 0.8, 0.2).onClick(function () {
  console.log('clicked')
})

// change many properties at once
btn.setProps({
  background : '#00bbbb',
  textSize: 50
})

Output: photo_2020-07-04_20-06-07

victordiaz commented 4 years ago

This got quite nice in the last versions, so closing the question