UI cleanup and reorg, one page per example
This commit is contained in:
parent
749e88af02
commit
365628c648
@ -30,13 +30,44 @@ PlasmaComponents.Page {
|
||||
|
||||
property string shader
|
||||
property alias shaderText: editor.text
|
||||
property string pageName: "Shaders"
|
||||
property string icon: "preferences-desktop-mouse"
|
||||
property string pageName: "Editor"
|
||||
property string icon: "accessories-text-editor"
|
||||
|
||||
anchors {
|
||||
fill: parent
|
||||
margins: _s
|
||||
}
|
||||
/*
|
||||
ShaderEffectSource {
|
||||
id: effectSource
|
||||
sourceItem: editorPage
|
||||
hideSource: hideSourceCheckbox.checked
|
||||
}
|
||||
|
||||
ShaderEffect {
|
||||
id: mainShader
|
||||
anchors.fill: editorPage
|
||||
property variant source: effectSource
|
||||
property real f: 0
|
||||
property real f2: 0
|
||||
property int intensity: 1
|
||||
smooth: true
|
||||
}
|
||||
PlasmaComponents.ToolButton {
|
||||
iconSource: "dialog-close"
|
||||
width: _h
|
||||
height: width
|
||||
visible: !(mainShader.fragmentShader == "" && mainShader.vertexShader == "")
|
||||
anchors { top: parent.top; right: parent.right; }
|
||||
onClicked: {
|
||||
mainShader.fragmentShader = "";
|
||||
mainShader.vertexShader = "";
|
||||
fragmentPage.shader = ""
|
||||
vertexPage.shader = ""
|
||||
}
|
||||
}
|
||||
|
||||
*/
|
||||
|
||||
PlasmaExtras.Heading {
|
||||
id: heading
|
||||
@ -66,7 +97,12 @@ PlasmaComponents.Page {
|
||||
PlasmaComponents.Button {
|
||||
id: applyButton
|
||||
text: "Upload Shader"
|
||||
onClicked: shader = editor.text
|
||||
onClicked: {
|
||||
shader = editor.text
|
||||
print("Uploading new vertex shader: \n" + shader);
|
||||
mainShader.vertexShader = shader;
|
||||
}
|
||||
|
||||
anchors {
|
||||
right: parent.right
|
||||
bottom: parent.bottom
|
||||
@ -74,5 +110,13 @@ PlasmaComponents.Page {
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
// PlasmaComponents.CheckBox {
|
||||
// id: hideSourceCheckbox
|
||||
// text: "Hide Source Item"
|
||||
// anchors { bottom: parent.bottom; left: parent.left; margins: _s; }
|
||||
// onCheckedChanged: effectSource.hideSource = checked
|
||||
// }
|
||||
|
||||
}
|
||||
|
@ -47,15 +47,11 @@ PlasmaComponents.Page {
|
||||
}
|
||||
text: pageName
|
||||
}
|
||||
SimpleExample {
|
||||
id: simpleShader
|
||||
//parent: root
|
||||
anchors.fill: examplesPage
|
||||
parent: examplesPage.parent
|
||||
|
||||
opacity: 0.2
|
||||
//source: effectSource
|
||||
}
|
||||
// SimpleExample {
|
||||
// id: simpleShader
|
||||
// //parent: root
|
||||
// //source: effectSource
|
||||
// }
|
||||
Image {
|
||||
id: imageItem
|
||||
width: 200
|
||||
@ -64,48 +60,48 @@ PlasmaComponents.Page {
|
||||
///source: "http://vizzzion.org/blog/wp-content/uploads/2013/01/ktouch.png"
|
||||
source: "file:///home/sebas/Pictures/Damselfly.jpg"
|
||||
}
|
||||
TubeExample {
|
||||
id: tubeShader
|
||||
anchors.fill: imageItem
|
||||
source: ShaderEffectSource {
|
||||
//sourceRect: Qt.rect(-50, -50, width+100, height+100)
|
||||
//sourceRect: Qt.rect(10, 20, 50, 80)
|
||||
sourceItem: imageItem
|
||||
hideSource: hideSourceCheckbox.checked
|
||||
}
|
||||
}
|
||||
GridView {
|
||||
id: grid
|
||||
anchors {
|
||||
top: heading.bottom;
|
||||
topMargin: _s
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
bottom: applyButton.top
|
||||
bottomMargin: _s
|
||||
|
||||
}
|
||||
model: VisualItemModel {
|
||||
PlasmaComponents.Button {
|
||||
checkable: true;
|
||||
text: "Simple";
|
||||
onClicked: {
|
||||
simpleShader.visible = checked;
|
||||
// fragmentPage.shaderText = simpleShader.fragmentShader;
|
||||
// vertexPage.shaderText = simpleShader.vertexShader;
|
||||
}
|
||||
}
|
||||
PlasmaComponents.Button {
|
||||
checkable: true;
|
||||
text: "Tube";
|
||||
onClicked: {
|
||||
tubeShader.visible = checked;
|
||||
mainItem.opacity = checked ? 0.1 : 0.1
|
||||
// fragmentPage.shaderText = tubeShader.fragmentShader;
|
||||
// vertexPage.shaderText = tubeShader.vertexShader;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// TubeExample {
|
||||
// id: tubeShader
|
||||
// anchors.fill: imageItem
|
||||
// source: ShaderEffectSource {
|
||||
// //sourceRect: Qt.rect(-50, -50, width+100, height+100)
|
||||
// //sourceRect: Qt.rect(10, 20, 50, 80)
|
||||
// sourceItem: imageItem
|
||||
// hideSource: hideSourceCheckbox.checked
|
||||
// }
|
||||
// }
|
||||
// GridView {
|
||||
// id: grid
|
||||
// anchors {
|
||||
// top: heading.bottom;
|
||||
// topMargin: _s
|
||||
// left: parent.left
|
||||
// right: parent.right
|
||||
// bottom: applyButton.top
|
||||
// bottomMargin: _s
|
||||
//
|
||||
// }
|
||||
// model: VisualItemModel {
|
||||
// PlasmaComponents.Button {
|
||||
// checkable: true;
|
||||
// text: "Simple";
|
||||
// onClicked: {
|
||||
// simpleShader.visible = checked;
|
||||
// // fragmentPage.shaderText = simpleShader.fragmentShader;
|
||||
// // vertexPage.shaderText = simpleShader.vertexShader;
|
||||
// }
|
||||
// }
|
||||
// PlasmaComponents.Button {
|
||||
// checkable: true;
|
||||
// text: "Tube";
|
||||
// onClicked: {
|
||||
// tubeShader.visible = checked;
|
||||
// mainItem.opacity = checked ? 0.1 : 0.1
|
||||
// // fragmentPage.shaderText = tubeShader.fragmentShader;
|
||||
// // vertexPage.shaderText = tubeShader.vertexShader;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
}
|
||||
|
||||
|
@ -25,17 +25,35 @@ import org.kde.qtextracomponents 0.1 as QtExtras
|
||||
|
||||
// VertexPage
|
||||
|
||||
ShaderEffect {
|
||||
PlasmaComponents.Page {
|
||||
id: examplesPage
|
||||
|
||||
visible: false
|
||||
//parent: root
|
||||
//anchors.fill: source.sourceItem
|
||||
property variant source: ShaderEffectSource {
|
||||
sourceItem: mainItem
|
||||
hideSource: true
|
||||
//property string shader
|
||||
property string pageName: "Shader Examples"
|
||||
property string pageDescription: "Shader Examples"
|
||||
property string icon: "weather-clear"
|
||||
|
||||
anchors {
|
||||
fill: parent
|
||||
margins: _s
|
||||
}
|
||||
|
||||
//property variant source: effectSource
|
||||
|
||||
PlasmaExtras.Heading {
|
||||
id: heading
|
||||
level: 1
|
||||
anchors {
|
||||
top: parent.top;
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
}
|
||||
text: pageName
|
||||
}
|
||||
PlasmaComponents.Label {
|
||||
anchors {
|
||||
top: heading.bottom;
|
||||
left: parent.left;
|
||||
right: parent.right;
|
||||
}
|
||||
text: pageDescription
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -18,21 +18,22 @@
|
||||
|
||||
import QtQuick 2.0
|
||||
|
||||
import org.kde.plasma.core 0.1 as PlasmaCore
|
||||
import org.kde.plasma.components 0.1 as PlasmaComponents
|
||||
import org.kde.plasma.extras 0.1 as PlasmaExtras
|
||||
import org.kde.qtextracomponents 0.1 as QtExtras
|
||||
|
||||
// VertexPage
|
||||
|
||||
ShaderExample {
|
||||
// parent: root
|
||||
|
||||
fragmentShader: { " \
|
||||
void main(void) { \
|
||||
gl_FragColor = vec4(1.0, 0.0, 0.0, 0.3); \
|
||||
} \
|
||||
"
|
||||
pageName: "Simple shader"
|
||||
pageDescription: "Paints a red, translucent rectangle"
|
||||
|
||||
ShaderEffect {
|
||||
anchors.fill: parent
|
||||
anchors.topMargin: 48
|
||||
opacity: 0.2
|
||||
|
||||
fragmentShader: { " \
|
||||
void main(void) { \
|
||||
gl_FragColor = vec4(1.0, 0.0, 0.0, 0.3); \
|
||||
} \
|
||||
"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -18,70 +18,74 @@
|
||||
|
||||
import QtQuick 2.0
|
||||
|
||||
import org.kde.plasma.core 0.1 as PlasmaCore
|
||||
import org.kde.plasma.components 0.1 as PlasmaComponents
|
||||
import org.kde.plasma.extras 0.1 as PlasmaExtras
|
||||
import org.kde.qtextracomponents 0.1 as QtExtras
|
||||
|
||||
// VertexPage
|
||||
|
||||
ShaderExample {
|
||||
|
||||
//anchors.fill: imageItem
|
||||
//property real time
|
||||
property variant mouse
|
||||
property variant resolution
|
||||
pageName: "Wave"
|
||||
pageDescription: "Makes an image wobble"
|
||||
|
||||
property int fadeDuration: 250
|
||||
property real amplitude: 0.04 * 0.4
|
||||
property real frequency: 20
|
||||
property real time: 0
|
||||
// source: ShaderEffectSource {
|
||||
// sourceItem: imageItem
|
||||
// hideSource: true
|
||||
// }
|
||||
//
|
||||
|
||||
NumberAnimation on time { loops: Animation.Infinite; from: 0; to: Math.PI * 2; duration: 600 }
|
||||
Behavior on amplitude { NumberAnimation { duration: fadeDuration } }
|
||||
|
||||
//vertexShader: ""
|
||||
fragmentShader: { mainItem.opacity = 0;
|
||||
"uniform lowp float qt_Opacity;" +
|
||||
"uniform highp float amplitude;" +
|
||||
"uniform highp float frequency;" +
|
||||
"uniform highp float time;" +
|
||||
"uniform sampler2D source;" +
|
||||
"varying highp vec2 qt_TexCoord0;" +
|
||||
"void main() {" +
|
||||
" highp vec2 p = sin(time + frequency * qt_TexCoord0);" +
|
||||
" gl_FragColor = texture2D(source, qt_TexCoord0 + amplitude * vec2(p.y, -p.x)) * qt_Opacity;" +
|
||||
"}"
|
||||
/*
|
||||
fragmentShader: {
|
||||
"uniform float time; \
|
||||
uniform vec2 mouse; \
|
||||
uniform vec2 resolution; \
|
||||
void main( void ) \
|
||||
{ \
|
||||
// vec2 uPos = ( gl_FragCoord.xy / resolution.xy );//normalize wrt y axis \
|
||||
// //suPos -= vec2((resolution.x/resolution.y)/2.0, 0.0);//shift origin to center \
|
||||
// uPos.x -= 8.0; \
|
||||
// uPos.y -= 0.5; \
|
||||
// vec3 color = vec3(0.0); \
|
||||
// float vertColor = 0.0; \
|
||||
// for( float i = 0.0; i < 15.0; ++i ) { \
|
||||
// float t = time * (0.9); \
|
||||
// uPos.y += sin( uPos.x*i + t+i/2.0 ) * 0.1; \
|
||||
// float fTemp = abs(1.0 / uPos.y / 100.0); \
|
||||
// vertColor += fTemp; \
|
||||
// color += vec3( fTemp*(10.0-i)/10.0, fTemp*i/10.0, pow(fTemp,1.5)*1.5 ); \
|
||||
// } \
|
||||
// vec4 color_final = vec4(color, 1.0); \
|
||||
// gl_FragColor = color_final; \
|
||||
} \
|
||||
"
|
||||
*/
|
||||
Image {
|
||||
id: imageItem
|
||||
anchors.fill: parent
|
||||
anchors.topMargin: 48
|
||||
}
|
||||
}
|
||||
|
||||
ShaderEffect {
|
||||
|
||||
anchors.fill: imageItem
|
||||
//property real time
|
||||
property variant mouse
|
||||
property variant resolution
|
||||
|
||||
property int fadeDuration: 250
|
||||
property real amplitude: 0.04 * 0.4
|
||||
property real frequency: 20
|
||||
property real time: 0
|
||||
source: ShaderEffectSource {
|
||||
sourceItem: imageItem
|
||||
hideSource: true
|
||||
}
|
||||
|
||||
NumberAnimation on time { loops: Animation.Infinite; from: 0; to: Math.PI * 2; duration: 600 }
|
||||
Behavior on amplitude { NumberAnimation { duration: fadeDuration } }
|
||||
|
||||
//vertexShader: ""
|
||||
fragmentShader: { mainItem.opacity = 0;
|
||||
"uniform lowp float qt_Opacity;" +
|
||||
"uniform highp float amplitude;" +
|
||||
"uniform highp float frequency;" +
|
||||
"uniform highp float time;" +
|
||||
"uniform sampler2D source;" +
|
||||
"varying highp vec2 qt_TexCoord0;" +
|
||||
"void main() {" +
|
||||
" highp vec2 p = sin(time + frequency * qt_TexCoord0);" +
|
||||
" gl_FragColor = texture2D(source, qt_TexCoord0 + amplitude * vec2(p.y, -p.x)) * qt_Opacity;" +
|
||||
"}"
|
||||
/*
|
||||
fragmentShader: {
|
||||
"uniform float time; \
|
||||
uniform vec2 mouse; \
|
||||
uniform vec2 resolution; \
|
||||
void main( void ) \
|
||||
{ \
|
||||
// vec2 uPos = ( gl_FragCoord.xy / resolution.xy );//normalize wrt y axis \
|
||||
// //suPos -= vec2((resolution.x/resolution.y)/2.0, 0.0);//shift origin to center \
|
||||
// uPos.x -= 8.0; \
|
||||
// uPos.y -= 0.5; \
|
||||
// vec3 color = vec3(0.0); \
|
||||
// float vertColor = 0.0; \
|
||||
// for( float i = 0.0; i < 15.0; ++i ) { \
|
||||
// float t = time * (0.9); \
|
||||
// uPos.y += sin( uPos.x*i + t+i/2.0 ) * 0.1; \
|
||||
// float fTemp = abs(1.0 / uPos.y / 100.0); \
|
||||
// vertColor += fTemp; \
|
||||
// color += vec3( fTemp*(10.0-i)/10.0, fTemp*i/10.0, pow(fTemp,1.5)*1.5 ); \
|
||||
// } \
|
||||
// vec4 color_final = vec4(color, 1.0); \
|
||||
// gl_FragColor = color_final; \
|
||||
} \
|
||||
"
|
||||
*/
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
@ -31,10 +31,6 @@ Item {
|
||||
property int _s: theme.iconSizes.small
|
||||
property int _h: theme.iconSizes.desktop
|
||||
|
||||
PlasmaCore.DataSource {
|
||||
id: dataSource
|
||||
|
||||
}
|
||||
Item {
|
||||
id: mainItem
|
||||
anchors.fill: parent
|
||||
@ -49,9 +45,9 @@ Item {
|
||||
}
|
||||
height: _h
|
||||
|
||||
PlasmaComponents.TabButton { tab: examplesPage; iconSource: examplesPage.icon; }
|
||||
PlasmaComponents.TabButton { tab: wobbleExample; text: tab.pageName; }
|
||||
PlasmaComponents.TabButton { tab: simpleExample; text: tab.pageName; }
|
||||
PlasmaComponents.TabButton { tab: vertexPage; iconSource: vertexPage.icon; }
|
||||
PlasmaComponents.TabButton { tab: fragmentPage; iconSource: fragmentPage.icon; }
|
||||
}
|
||||
|
||||
PlasmaComponents.TabGroup {
|
||||
@ -63,54 +59,15 @@ Item {
|
||||
bottom: parent.bottom
|
||||
}
|
||||
|
||||
//currentTab: tabBar.currentTab
|
||||
|
||||
|
||||
ExamplesPage {
|
||||
id: examplesPage
|
||||
WobbleExample {
|
||||
id: wobbleExample
|
||||
}
|
||||
VertexPage {
|
||||
SimpleExample {
|
||||
id: simpleExample
|
||||
}
|
||||
EditorPage {
|
||||
id: vertexPage
|
||||
}
|
||||
FragmentPage {
|
||||
id: fragmentPage
|
||||
}
|
||||
}
|
||||
}
|
||||
ShaderEffectSource {
|
||||
id: effectSource
|
||||
sourceItem: mainItem
|
||||
hideSource: hideSourceCheckbox.checked
|
||||
}
|
||||
|
||||
ShaderEffect {
|
||||
id: mainShader
|
||||
anchors.fill: mainItem
|
||||
property variant source: effectSource
|
||||
property real f: 0
|
||||
property real f2: 0
|
||||
property int intensity: 1
|
||||
smooth: true
|
||||
}
|
||||
|
||||
PlasmaComponents.CheckBox {
|
||||
id: hideSourceCheckbox
|
||||
text: "Hide Source Item"
|
||||
anchors { bottom: parent.bottom; left: parent.left; margins: _s; }
|
||||
onCheckedChanged: effectSource.hideSource = checked
|
||||
}
|
||||
|
||||
PlasmaComponents.ToolButton {
|
||||
iconSource: "dialog-close"
|
||||
width: _h
|
||||
height: width
|
||||
visible: !(mainShader.fragmentShader == "" && mainShader.vertexShader == "")
|
||||
anchors { top: parent.top; right: parent.right; }
|
||||
onClicked: {
|
||||
mainShader.fragmentShader = "";
|
||||
mainShader.vertexShader = "";
|
||||
fragmentPage.shader = ""
|
||||
vertexPage.shader = ""
|
||||
}
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user