{"id":1288,"date":"2023-04-14T12:40:31","date_gmt":"2023-04-14T16:40:31","guid":{"rendered":"https:\/\/jausoft.com\/blog\/?p=1288"},"modified":"2023-04-14T12:40:31","modified_gmt":"2023-04-14T16:40:31","slug":"graphui-fontview-app-micro-fontforge","status":"publish","type":"post","link":"https:\/\/jausoft.com\/blog\/2023\/04\/14\/graphui-fontview-app-micro-fontforge\/","title":{"rendered":"GraphUI &#8211; FontView App (Micro FontForge)"},"content":{"rendered":"<p>Refining the UI elements in our <a href=\"https:\/\/jausoft.com\/blog\/tag\/graph_type_rendering\/\">Graph Type Rendering and UI<\/a> saga, pushing demos and apps for use cases. This time its <a href=\"https:\/\/jogamp.org\/cgit\/jogl.git\/tree\/src\/demos\/com\/jogamp\/opengl\/demos\/graph\/ui\/FontView01.java#n60\">FontView01<\/a>, which may become a <em>micro FontForge<\/em> using it as its role model. It also demonstrate that our GraphUI scenegraph allows reusing instances, rendering it effectively a <em>Directed Acyclic Graph<\/em> (DAG).<!--more--><\/p>\n<p>Reusing <em>Shape<\/em> instances is especially useful if maintaining its position and scale, i.e. adding another view of the same thing as shown below by the new <a href=\"https:\/\/jogamp.org\/cgit\/jogl.git\/tree\/src\/demos\/com\/jogamp\/opengl\/demos\/graph\/ui\/FontView01.java#n60\">FontView01<\/a>. The glyph `ae` is presented within two <em>Group<\/em>s, the main-grid on the left and the info-grid on the right.<\/p>\n<p><a href=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/04\/FontView01-vbaa-s04-fsaa0-FreeSerif_Regular_gid169-snap03-1280x0720-1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1289\" src=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/04\/FontView01-vbaa-s04-fsaa0-FreeSerif_Regular_gid169-snap03-1280x0720-1.png\" alt=\"\" width=\"1280\" height=\"720\" srcset=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/04\/FontView01-vbaa-s04-fsaa0-FreeSerif_Regular_gid169-snap03-1280x0720-1.png 1280w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/04\/FontView01-vbaa-s04-fsaa0-FreeSerif_Regular_gid169-snap03-1280x0720-1-300x169.png 300w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/04\/FontView01-vbaa-s04-fsaa0-FreeSerif_Regular_gid169-snap03-1280x0720-1-1024x576.png 1024w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/04\/FontView01-vbaa-s04-fsaa0-FreeSerif_Regular_gid169-snap03-1280x0720-1-768x432.png 768w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/04\/FontView01-vbaa-s04-fsaa0-FreeSerif_Regular_gid169-snap03-1280x0720-1-1088x612.png 1088w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/a>I have to fix the GridLayout, i.e. exposing proper Gap (or Margin) and Padding. The former is for outside cell&#8217;s &#8211; or cell-to-cell spacing and the latter for inside cell spacing. Currently the code names Padding, but has the Grid Gap implemented. This will be fixed, hence GraphUI will follow proper CSS Layout semantics.<\/p>\n<div style=\"width: 640px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-1288-1\" width=\"640\" height=\"360\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/jausoft.com\/Files\/media\/20230416-FontView01.mp4?_=1\" \/><a href=\"https:\/\/jausoft.com\/Files\/media\/20230416-FontView01.mp4\">https:\/\/jausoft.com\/Files\/media\/20230416-FontView01.mp4<\/a><\/video><\/div>\n<p style=\"text-align: center;\">(<a href=\"https:\/\/jausoft.com\/Files\/media\/20230416-FontView01.mp4\">Direct video URL<\/a>, download and share \u2013 or just view at original resolution)<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Refining the UI elements in our Graph Type Rendering and UI saga, pushing demos and apps for use cases. This time its FontView01, which may become a micro FontForge using it as its role model. It also demonstrate that our GraphUI scenegraph allows reusing instances, rendering it effectively a Directed Acyclic Graph (DAG).<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[7,3,8],"tags":[9,13,22,71,16,44,17,46,68],"class_list":["post-1288","post","type-post","status-publish","format-standard","hentry","category-3d-opengl","category-computer-stuff","category-jogamp","tag-3d","tag-embedded-device","tag-fonts","tag-graph_type_rendering","tag-java","tag-jogamp","tag-opengl","tag-openjdk","tag-type-rendering"],"_links":{"self":[{"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/posts\/1288","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/comments?post=1288"}],"version-history":[{"count":1,"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/posts\/1288\/revisions"}],"predecessor-version":[{"id":1290,"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/posts\/1288\/revisions\/1290"}],"wp:attachment":[{"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/media?parent=1288"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/categories?post=1288"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/tags?post=1288"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}