modulate photo filter
Framer_modulate + photo filter : sliderComponent knob
스크롤컴포넌트 & 모듈레이트로 포토필터
sliderComponent + modulate
Framer.Extras.Hints.disable()
frame = new Layer
width: Screen.width
height: Screen.width
image: "images/0.png"
properties = ["grayscale","Blur","Brightness"]
allSliders = []
for i in [0..2]
control = new Layer
width: Screen.width
backgroundColor: null
html:properties[i]
style:
textAlign:"center"
fontSize:"36px"
lineHeight:"2.5"
control.y = Screen.width + control.height * i
slider = new SliderComponent
width: Screen.width - 200
parent:control
y:100
midX:Screen.width/2
slider.knobSize = 50
slider.knob.shadowY = 10
slider.knob.shadowBlur = 20
slider.animateToValue(0,{time:0})
//기본값 설정
allSliders.push(slider)
allSliders[0].on "change:value", ->
frame.grayscale = Utils.modulate(this.value,[0,1],[0,100],true)
allSliders[1].on "change:value", ->
frame.blur = Utils.modulate(this.value,[0,1],[0,30],true)
allSliders[2].on "change:value", ->
frame.brightness = Utils.modulate(this.value,[0,1],[100,50],true)
Written on April 9, 2017
comments powered by Disqus