omar/panopainter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added node alignment and text color

Browse Source
This commit is contained in:
omigamedev
2017-02-07 13:39:17 +00:00
parent 3cc25e7592
commit 83e59573e0
7 changed files with 84 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
data/layout.xml
View File

@@ -1,10 +1,14 @@
<?xml version="1.0"?> <?xml version="1.0"?>
<root> <root>
<layout id="button"> <layout id="button">
<border width="50" margin="0 5 0 0" color=".1" thickness="2" border-color=".5"></border> <border width="50" margin="0 5 0 0" color=".1" thickness="2" border-color=".5">
<text text="A" font-face="arial" font-size="11"/>
</border>
</layout> </layout>
<layout id="multi-button-item"> <layout id="multi-button-item">
<border height="50%" width="50%" color=".1" thickness="2" border-color=".5" /> <border height="50%" width="50%" color=".1" thickness="2" border-color=".5" justify="center" align="center">
<text text="A" font-face="arial" font-size="11"/>
</border>
</layout> </layout>
<layout id="multi-button"> <layout id="multi-button">
<node width="50" margin="0 5 0 0" dir="row" wrap="1"> <node width="50" margin="0 5 0 0" dir="row" wrap="1">
@@ -25,24 +29,26 @@
<ref id="multi-button"/> <ref id="multi-button"/>
<ref id="multi-button"/> <ref id="multi-button"/>
<ref id="multi-button"/> <ref id="multi-button"/>
<ref id="button"></ref> <border width="50" margin="0 5 0 0" color=".1" thickness="2" border-color=".5" justify="center" align="center">
<separator width="10" /> <text text="button" font-face="arial" font-size="11"/>
<border width="50" margin="0 5 0 0" color=".1" thickness="2" border-color=".5"></border> </border>
<border width="50" margin="0 5 0 0" color=".2" thickness="2" border-color=".5"></border> <separator width="10"/>
<border width="50" margin="0 5 0 0" color=".3" thickness="2" border-color=".5"></border> <border width="50" margin="0 5 0 0" color=".1" thickness="2" border-color=".5" justify="center" align="center"><text text="red" font-face="arial" font-size="11" color="1 0 0 1"/></border>
<separator width="10" /> <border width="50" margin="0 5 0 0" color=".2" thickness="2" border-color=".5" justify="center" align="center"><text text="blue" font-face="arial" font-size="11" color="0 0 1 1"/></border>
<border width="50" margin="0 5 0 0" color=".3" thickness="2" border-color=".5" justify="center" align="center"><text text="green" font-face="arial" font-size="11" color="0 1 0 1"/></border>
<separator width="10"/>
<border width="50" margin="0 5 0 0" color=".1" thickness="2" border-color=".7"></border> <border width="50" margin="0 5 0 0" color=".1" thickness="2" border-color=".7"></border>
<border width="50" margin="0 5 0 0" color=".2" thickness="2" border-color=".7"></border> <border width="50" margin="0 5 0 0" color=".2" thickness="2" border-color=".7"></border>
<border width="50" margin="0 5 0 0" color=".3" thickness="2" border-color=".7"></border> <border width="50" margin="0 5 0 0" color=".3" thickness="2" border-color=".7"></border>
<separator width="10" /> <separator width="10"/>
<border width="50" margin="0 5 0 0"></border> <border width="50" margin="0 5 0 0"></border>
<border width="50" margin="0 5 0 0"></border> <border width="50" margin="0 5 0 0"></border>
<border width="50" margin="0 5 0 0"></border> <border width="50" margin="0 5 0 0"></border>
</border> </border>
<!-- central row --> <!-- central row -->
<plane grow="1" dir="row" wrap="1" height="0"> <node grow="1" dir="row" wrap="1" height="0">
<!-- side bar --> <!-- side bar -->
<plane width="200" height="100%" dir="col" color=".2"> <node width="200" height="100%" dir="col" color=".2">
<border pad="15" margin="10 0 10 0" color=".3" width="100%" height="auto"> <border pad="15" margin="10 0 10 0" color=".3" width="100%" height="auto">
<border height="30" color=".4" /> <border height="30" color=".4" />
<border height="30" color=".4" /> <border height="30" color=".4" />
@@ -55,14 +61,17 @@
<border height="30" color=".4" /> <border height="30" color=".4" />
<border height="30" color=".4" /> <border height="30" color=".4" />
</border> </border>
</plane> </node>
<!-- content panel --> <!-- content panel -->
<border width="1" grow="1" height="100%" pad="10" wrap="1"> <node width="1" grow="1" height="100%" pad="10" wrap="1" dir="col" justify="center" align="center">
<text text="hello widget" font-face="arial" font-size="11" width="100" height="100"/> <text text="hello widget" font-face="arial" font-size="30" color="0 1 1 1"/>
</border> <text text="this is a small description of the useless big text above" font-face="arial" font-size="11" color="0 1 1 1"/>
</plane> </node>
</node>
<!-- status bar --> <!-- status bar -->
<border height="30" width="100%" color=".15" border-color=".3" /> <border height="30" width="100%" color=".15" border-color=".3" dir="row" pad="0 0 0 10" align="center">
<text text="Status Bar: nothing to show here." font-face="arial" font-size="11"/>
</border>
</node> </node>
</layout> </layout>
</root> </root>

15
engine/app.cpp
View File

@@ -65,11 +65,11 @@ void App::init()
static const char* shader_font_f = static const char* shader_font_f =
"#version 150\n" "#version 150\n"
"uniform sampler2D tex;" "uniform sampler2D tex;"
"uniform vec4 col;"
"in vec2 uv;" "in vec2 uv;"
"out vec4 frag;" "out vec4 frag;"
"void main(){" "void main(){"
//" frag = vec4(1,0,0,1);" " frag = vec4(texture(tex, uv).r * col.rgb, col.a);"
" frag = texture(tex, uv);"
"}"; "}";
#ifdef _WIN32 #ifdef _WIN32
@@ -99,7 +99,8 @@ void App::init()
const char* ttf = "/Library/Fonts/Arial.ttf"; const char* ttf = "/Library/Fonts/Arial.ttf";
#endif #endif
FontManager::init(); FontManager::init();
FontManager::load(kFont::Arial_11, ttf); FontManager::load(kFont::Arial_11, ttf, 13);
FontManager::load(kFont::Arial_30, ttf, 30);
layout.load("data/layout.xml"); layout.load("data/layout.xml");
//layout["main"].update(width, height); //layout["main"].update(width, height);
@@ -114,10 +115,6 @@ void App::init()
if (!tex.load("data/uvs.jpg")) if (!tex.load("data/uvs.jpg"))
printf("error loading image\n"); printf("error loading image\n");
text.create();
text.update(kFont::Arial_11, "hello font");
plane.create<1>(400, 400);
glEnable(GL_TEXTURE_2D); glEnable(GL_TEXTURE_2D);
glDisable(GL_DEPTH_TEST); glDisable(GL_DEPTH_TEST);
glPointSize(5); glPointSize(5);
@@ -168,10 +165,6 @@ void App::update(float dt)
glm::mat4 proj = glm::ortho(0.f, width, height, 0.f, -1.f, 1.f); glm::mat4 proj = glm::ortho(0.f, width, height, 0.f, -1.f, 1.f);
glm::mat4 tran = glm::translate(glm::vec3(200, 200, 0)); glm::mat4 tran = glm::translate(glm::vec3(200, 200, 0));
ShaderManager::use(kShader::Font);
ShaderManager::u_int(kShaderUniform::Tex, 0);
ShaderManager::u_mat4(kShaderUniform::MVP, proj * tran);
text.draw();
/* /*
static int i = 0; static int i = 0;
i = (i + 1) % 32; i = (i + 1) % 32;

3
engine/app.h
View File

@@ -11,9 +11,6 @@ class App
Sampler sampler; Sampler sampler;
Texture2D tex; Texture2D tex;
LayoutManager layout; LayoutManager layout;
Plane plane;
Font font;
TextMesh text;
public: public:
static App I; static App I;
float width; float width;

8
engine/font.cpp
View File

@@ -5,7 +5,7 @@
std::map<kFont, Font> FontManager::m_fonts; std::map<kFont, Font> FontManager::m_fonts;
Sampler FontManager::m_sampler; Sampler FontManager::m_sampler;
bool Font::load(const char* ttf) bool Font::load(const char* ttf, int font_size)
{ {
FILE* font_file = fopen(ttf, "rb"); FILE* font_file = fopen(ttf, "rb");
if (font_file) if (font_file)
@@ -18,7 +18,7 @@ bool Font::load(const char* ttf)
assert(bytes==sz); assert(bytes==sz);
auto bitmap = std::make_unique<uint8_t[]>(w*h); auto bitmap = std::make_unique<uint8_t[]>(w*h);
chars.resize(num_chars); chars.resize(num_chars);
int ret = stbtt_BakeFontBitmap(data.get(), 0, 50, bitmap.get(), w, h, start_char, num_chars, chars.data()); int ret = stbtt_BakeFontBitmap(data.get(), 0, (float)font_size, bitmap.get(), w, h, start_char, num_chars, chars.data());
font_tex.create(w, h, GL_RED, bitmap.get()); font_tex.create(w, h, GL_RED, bitmap.get());
fclose(font_file); fclose(font_file);
return true; return true;
@@ -31,9 +31,9 @@ void FontManager::init()
m_sampler.create(); m_sampler.create();
} }
bool FontManager::load(kFont id, const char *ttf) bool FontManager::load(kFont id, const char* ttf, int sz)
{ {
return m_fonts[id].load(ttf); return m_fonts[id].load(ttf, sz);
} }
const Font& FontManager::get(kFont id) const Font& FontManager::get(kFont id)

5
engine/font.h
View File

@@ -5,6 +5,7 @@
enum class kFont : uint16_t enum class kFont : uint16_t
{ {
Arial_11 = const_hash("arial-11"), Arial_11 = const_hash("arial-11"),
Arial_30 = const_hash("arial-30"),
}; };
class Font class Font
@@ -18,7 +19,7 @@ public:
Texture2D font_tex; Texture2D font_tex;
std::vector<stbtt_bakedchar> chars; std::vector<stbtt_bakedchar> chars;
bool load(const char* ttf); bool load(const char* ttf, int sz);
}; };
class FontManager class FontManager
@@ -27,7 +28,7 @@ public:
static std::map<kFont, Font> m_fonts; static std::map<kFont, Font> m_fonts;
static Sampler m_sampler; static Sampler m_sampler;
static void init(); static void init();
static bool load(kFont id, const char* ttf); static bool load(kFont id, const char* ttf, int sz);
static const Font& get(kFont id); static const Font& get(kFont id);
}; };

30
engine/layout.cpp
View File

@@ -127,6 +127,36 @@ void Node::parse_attributes(kAttribute ka, const tinyxml2::XMLAttribute* attr)
case kAttribute::FlexWrap: case kAttribute::FlexWrap:
YGNodeStyleSetFlexWrap(y_node, attr->IntValue() ? YGWrapWrap : YGWrapNoWrap); YGNodeStyleSetFlexWrap(y_node, attr->IntValue() ? YGWrapWrap : YGWrapNoWrap);
break; break;
case kAttribute::Justify:
{
YGJustify v = YGJustifyFlexStart;
if (strcmp("center", attr->Value()) == 0)
v = YGJustifyCenter;
else if (strcmp("flex-start", attr->Value()) == 0)
v = YGJustifyFlexStart;
else if (strcmp("flex-end", attr->Value()) == 0)
v = YGJustifyFlexEnd;
else if (strcmp("space-around", attr->Value()) == 0)
v = YGJustifySpaceAround;
else if (strcmp("space-between", attr->Value()) == 0)
v = YGJustifySpaceBetween;
YGNodeStyleSetJustifyContent(y_node, v);
break;
}
case kAttribute::Align:
{
YGAlign v = YGAlignStretch;
if (strcmp("stretch", attr->Value()) == 0)
v = YGAlignStretch;
else if (strcmp("flex-start", attr->Value()) == 0)
v = YGAlignFlexStart;
else if (strcmp("flex-end", attr->Value()) == 0)
v = YGAlignFlexEnd;
else if (strcmp("center", attr->Value()) == 0)
v = YGAlignCenter;
YGNodeStyleSetAlignItems(y_node, v);
break;
}
case kAttribute::Padding: case kAttribute::Padding:
{ {
glm::vec4 pad; glm::vec4 pad;

18
engine/layout.h
View File

@@ -29,6 +29,8 @@ enum class kAttribute : uint16_t
Text = const_hash("text"), Text = const_hash("text"),
FontFace = const_hash("font-face"), FontFace = const_hash("font-face"),
FontSize = const_hash("font-size"), FontSize = const_hash("font-size"),
Justify = const_hash("justify"),
Align = const_hash("align"),
}; };
enum class kWidget : uint16_t enum class kWidget : uint16_t
@@ -222,10 +224,13 @@ public:
TextMesh m_text_mesh; TextMesh m_text_mesh;
std::string m_text; std::string m_text;
std::string m_font; std::string m_font;
glm::vec4 m_color{ 1, 1, 1, 1 };
int m_size; int m_size;
virtual std::unique_ptr<Widget> clone() override virtual std::unique_ptr<Widget> clone() override
{ {
return nullptr; auto ret = std::make_unique<WidgetText>();
*ret = *this;
return std::move(ret);
} }
virtual void create() override virtual void create() override
{ {
@@ -240,6 +245,7 @@ public:
ShaderManager::use(kShader::Font); ShaderManager::use(kShader::Font);
ShaderManager::u_int(kShaderUniform::Tex, 0); ShaderManager::u_int(kShaderUniform::Tex, 0);
ShaderManager::u_mat4(kShaderUniform::MVP, mvp); ShaderManager::u_mat4(kShaderUniform::MVP, mvp);
ShaderManager::u_vec4(kShaderUniform::Col, m_color);
m_text_mesh.draw(); m_text_mesh.draw();
} }
virtual void parse_attributes(kAttribute ka, const tinyxml2::XMLAttribute* attr) override virtual void parse_attributes(kAttribute ka, const tinyxml2::XMLAttribute* attr) override
@@ -255,6 +261,16 @@ public:
case kAttribute::FontSize: case kAttribute::FontSize:
m_size = attr->IntValue(); m_size = attr->IntValue();
break; break;
case kAttribute::Color:
{
glm::vec4 pad;
int n = sscanf(attr->Value(), "%f %f %f %f", &pad.x, &pad.y, &pad.z, &pad.w);
if (n == 1)
m_color = glm::vec4(pad.x);
else
m_color = pad;
break;
}
default: default:
break; break;
} }