1
0
mirror of https://github.com/lxsang/Diya-API.git synced 2024-12-26 11:28:22 +01:00

Correct openGL transparent color display problem, stylesheet now allows style inheritance

This commit is contained in:
Dany LE 2022-08-08 00:12:54 +02:00
parent 007d99804f
commit 8b6a7927f4
9 changed files with 106 additions and 41 deletions

View File

@ -1,5 +1,15 @@
Extension { #name : #Array }
{ #category : #'*Diya' }
Array >> asDiyaStyle [
|style|
style := DiyaStyle new.
self do:[:v |
style at: v key put: v value
].
^style
]
{ #category : #'*Diya' }
Array >> asPoint [
^ (self at: 1 ifAbsent:[0]) @ (self at: 2 ifAbsent:[0])

View File

@ -22,6 +22,10 @@ Diya2DPrimShape >> boundingBox [
{ #category : #initialization }
Diya2DPrimShape >> draw [
vbuffer ifNil: [ ^self ].
OpenGL
enable: GL_CULL_FACE;
enable: GL_BLEND;
blendFnWithSfactor: GL_SRC_ALPHA dfactor: GL_ONE_MINUS_SRC_ALPHA.
"configure vao vbo for texture QUAD"
self texture ifNotNil: [
self texture setup.
@ -36,6 +40,9 @@ Diya2DPrimShape >> draw [
self texture ifNotNil: [self texture drop.].
self borderWidth > 0 ifTrue: [ self drawBorder ].
context vao disableAttribute: 0.
OpenGL
disable: GL_CULL_FACE;
disable: GL_BLEND.
]
{ #category : #initialization }

View File

@ -20,7 +20,13 @@ uniform vec4 u_bg_color;
uniform sampler2D u_texture;
varying vec2 texcoord;
void main(void) {
vec4 texcolor = vec4(0,0,0,0);
if(u_texture_type == 1)
{
// draw border
gl_FragColor = u_color;
return;
}
vec4 texcolor = u_bg_color;
// alpha
if(u_texture_type == 0x1906) {
texcolor = vec4(1, 1, 1, texture2D(u_texture, texcoord).a);
@ -28,19 +34,15 @@ void main(void) {
// rgba
else if (u_texture_type == 0x1908){
texcolor = texture2D(u_texture, texcoord);
}
else if(u_texture_type == 1)
{
texcolor = vec4(1,1,1,1);
}
}
vec4 pxcolor = texcolor * u_color;
if(pxcolor.a > 0.0)
{
{
gl_FragColor = pxcolor;
}
else
{
gl_FragColor = u_bg_color;
gl_FragColor = u_bg_color;
}
}'
]

View File

@ -23,16 +23,6 @@ DiyaEllipse class >> rx: rx ry: ry shader: s [
yourself
]
{ #category : #initialization }
DiyaEllipse >> draw [
OpenGL
enable: GL_BLEND;
blendFnWithSfactor: GL_SRC_ALPHA dfactor: GL_ONE_MINUS_SRC_ALPHA.
super draw.
OpenGL
disable: GL_BLEND
]
{ #category : #initialization }
DiyaEllipse >> drawBorder [
"do nothing"

View File

@ -17,12 +17,18 @@ DiyaExampleApp >> defineStyleSheet [
#fontSize -> 24.
#bgColor -> Color transparent.
};
define: #text_icon_2 extend:#text_icon_1 styles: {
#fontSize -> 16.
};
define: #image_view styles: {
#color -> (Color r: 1.0 g:1.0 b:1.0 alpha:1.0 ).
#border -> 3.
#color -> Color white.
#border -> 1.
#bgColor -> Color cyan.
#borderColor -> Color red
};
define: #rect_view extend: #image_view styles: {
#bgColor -> Color transparent.
};
define: #text_view styles: {
#color -> Color orange.
#fontSize -> 16.
@ -36,18 +42,18 @@ DiyaExampleApp >> defineStyleSheet [
define: #ell_view styles: {
#borderColor -> Color red.
#color -> Color white.
#bgColor -> Color cyan.
#border -> 3.
#border -> 2.
};
define: #poly_view styles: {
#borderColor -> Color red.
#color -> Color green.
#border -> 3.
#border -> 1.
#bgColor -> Color transparent.
};
define: #button_view styles: {
#borderColor -> Color red.
#borderColor -> (Color r: 0.051 g: 0.051 b: 0.051).
#color -> Color white.
#bgColor -> Color magenta.
#bgColor -> (Color r: 0.1529 g: 0.1529 b: 0.1529).
#border -> 1.
#yAlign -> #middle.
#xAlign -> #center
@ -80,7 +86,7 @@ DiyaExampleApp >> setup [
node extent:200@200.
node := root addNode: (DiyaRectangle new) at: 10@80.
node styleName: #image_view.
node styleName: #rect_view.
node extent: 240@320.
node := root addNode: (DiyaText data: String loremIpsum) at: 10@80.
@ -103,12 +109,13 @@ DiyaExampleApp >> setup [
node textureNamed: 'mrsang.png'.
node styleName: #poly_view.
"icon := root addNode: (DiyaFontIcon data: #(16rF101 16rF155 16rF185 16rF21B 16rF298 16rF254)) at: 240@500.
icon styleName: #text_icon_1 ."
icon := root addNode: (DiyaFontIcon data: #(16rF101 16rF155 16rF185 16rF21B 16rF298 16rF254)) at: 240@500.
icon styleName: #text_icon_2.
button := root addNode: (DiyaButton text: 'Click me !') at: 240@460.
button extent: 200@40.
button icon:16rF185"'mrsang.png'".
"button rotation: Float pi / 2.0."
button styleName: #button_view.
^ root
]

View File

@ -18,9 +18,9 @@ DiyaImageTex class >> fromFile: path [
{ #category : #accessing }
DiyaImageTex >> drop [
OpenGL
"OpenGL
disable: GL_CULL_FACE;
disable: GL_BLEND.
disable: GL_BLEND."
]
{ #category : #'instance creation' }
@ -72,10 +72,6 @@ DiyaImageTex >> path [
{ #category : #accessing }
DiyaImageTex >> setup [
OpenGL
enable: GL_CULL_FACE;
enable: GL_BLEND;
blendFnWithSfactor: GL_SRC_ALPHA dfactor: GL_ONE_MINUS_SRC_ALPHA.
OpenGLTexture
parameteri: GL_TEXTURE_2D pname: GL_TEXTURE_WRAP_S param: GL_CLAMP_TO_EDGE;
parameteri: GL_TEXTURE_2D pname: GL_TEXTURE_WRAP_T param: GL_CLAMP_TO_EDGE;

41
Diya/DiyaStyle.class.st Normal file
View File

@ -0,0 +1,41 @@
Class {
#name : #DiyaStyle,
#superclass : #DiyaBaseObject,
#instVars : [
'parent',
'style'
],
#category : #'Diya-Graphics'
}
{ #category : #accessing }
DiyaStyle >> at: name ifAbsent: aBlock [
|value|
value := style at: name ifAbsent:[nil].
value ifNotNil: [ ^value ].
parent ifNil: [ ^aBlock value ].
^ parent at:name ifAbsent: aBlock.
]
{ #category : #accessing }
DiyaStyle >> at: name put: value [
style at: name put: value
]
{ #category : #initialization }
DiyaStyle >> initialize [
super initialize.
style := Dictionary new.
parent := nil
]
{ #category : #accessing }
DiyaStyle >> parent [
^ parent
]
{ #category : #accessing }
DiyaStyle >> parent: anObject [
parent := anObject
]

View File

@ -8,16 +8,28 @@ Class {
}
{ #category : #convenience }
DiyaStyleSheet >> ? sheet [
^stylesheet at: sheet ifAbsent:[
DiyaCoreAPIError signal: 'Unable to query stylesheet ', sheet
DiyaStyleSheet >> ? styleName [
^stylesheet at: styleName ifAbsent:[
DiyaCoreAPIError signal: 'Unable to query stylesheet ', styleName
].
]
{ #category : #initialization }
DiyaStyleSheet >> define: name styles: styles [
stylesheet at: name put: styles asDictionary.
^self
DiyaStyleSheet >> define: styName extend: parentStyName styles: rules [
|parentSheet style|
parentSheet := self ? parentStyName.
style := self define: styName styles: rules.
style parent: parentSheet.
^style
]
{ #category : #initialization }
DiyaStyleSheet >> define: name styles: rules [
|style|
style := rules asDiyaStyle.
stylesheet at: name put: style.
^style
]

View File

@ -50,7 +50,7 @@ DiyaUIThemesManager >> defineDefaultTheme [
#xAlign -> #left.
#yAlign -> #middle.
#iconSize -> 24.
}
}; yourself
)
]