br77mont Posted March 5, 2019 Share Posted March 5, 2019 Hi, I am currently working on a complete hierarchical window system based on pixi client side (with all graphic primitives integrated inside the windows) populated thanks to a web socket node server. Here how it looks: Hierarchical window system I need an extremely fast realtime graphic engine and pixi is really great for that! I want to reduce at minimum usage of any classic web technology. (dom creation, svg , framework...) However, I need a multi-line edit text component inside pixi. I guess nothing exist in pixi to deal with that? . I have seen the pixi demo about multi line but it's only about dealing with \n. What I want is to really be able to display text depending of the language ( word detect, line break, ... depends of the language). Have you other solution in mind than inserting classic html text over pixi? Br Bruno Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted March 5, 2019 Share Posted March 5, 2019 I believe pixi-ui has it. Treat it like a codebase that you can copy stuff from. It has no docs, only author contacts. Quote Link to comment Share on other sites More sharing options...
jonforum Posted March 5, 2019 Share Posted March 5, 2019 on my side i dont understand maybe preview can help, but if you mean multi styles inline ? No pixijs dont allow multi styles you need your own engine. You need made your own text engine with regexr to split texte with styles. If you mean multi line only yes pixijs take multi line but with same styles. i dont know if this can help you but here myself question am ask .. and another here treade here who talk about multi line and animation. hope this help you, if no? am sorry to not fully understand your issue !:) please give more detail. Quote Link to comment Share on other sites More sharing options...
jonforum Posted March 5, 2019 Share Posted March 5, 2019 or do you mean somthing like this ??? the huds are in pure htm and css l but rendering in pixijs. your realy need to give more explaine for get more help Quote Link to comment Share on other sites More sharing options...
br77mont Posted September 12, 2019 Author Share Posted September 12, 2019 Hi jonforum , sorry for the late answer... Finally I have not found something that really map my requirements; so I have decided to implement Html over pixi.. Here an example of what I am able to do currently mixing Pixi & Html components You can see few multiline text. text inside are in english and thanks to the classic <div> section, line and word break work fine. Our graphic runtime must be multi lingual and deal correctly with exotic language ( chinese, japanese, arabic...) I have not found an api that is able to take a text and a culture a pixel width as an input and tell me when I have to put line and word break. Anyway what I have done is to put html in absolute location over pixi. The tricky thing I have added is to be able to have pixi window over an absolute html component, and automatically compute the area to mask... It is done thanks to an html property that allow to define the area to display. (based on svg ) here an example how I configure my html. <div style="position: absolute; overflow: auto; left: 391px; top: 357px; width: 289px; height: 81px; clip-path: url("#clip-734341352566191080");">Quantum computing....</div> and the svg def <clipPath id="clip-734341352566191080"><path d="M0 0L289 0L289 81L0 81Z"></path></clipPath> On each resize/move of a pixi window I dynamically recompute svg clip-path... Br Bruno Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.