Results 1 to 13 of 13

Thread: [RESOLVED] Use RC6.Cairo to develop a VSCode-like UI

  1. #1

    Thread Starter
    Frenzied Member
    Join Date
    Aug 2020
    Posts
    1,538

    Resolved [RESOLVED] Use RC6.Cairo to develop a VSCode-like UI

    Recently I've been working on a VSCode-like UI using RC6.Cairo.

    VSCode's UI is simple and clear, but even so, I found that using RC6.Cairo to develop a VSCode-like UI is still a significant challenge. Since RC6.Widgets is an old-fashioned win7-style, I need to redevelop all the UI-components, even the ScrollBars. Not only do I need to redevelop Button, CheckBox, ComboBox, Menu, MenuBar, ToolBar, StatusBar, ListView, TreeView, TabStrip, PageSplitter, but I also needed to develop RichTextBox. This exposes me to a huge workload.

    I wonder if there are some good ways to ease my workload. Any advice and guidance would be greatly appreciated.
    Attached Images Attached Images   
    Last edited by SearchingDataOnly; Oct 3rd, 2024 at 09:49 AM.

  2. #2
    PowerPoster yereverluvinuncleber's Avatar
    Join Date
    Feb 2014
    Location
    Norfolk UK (inbred)
    Posts
    2,604

    Re: Use RC6.Cairo to develop a VSCode-like UI

    You really ought to be using the original RC equivalents within your forms designer, is this one of the reasons why only Olaf can build it, if you need the original source? Can you not just build the designer using the built-in RC widgets as you would build any normal RC app?
    https://github.com/yereverluvinunclebert

    Skillset: VMS,DOS,Windows Sysadmin from 1985, fault-tolerance, VaxCluster, Alpha,Sparc. DCL,QB,VBDOS- VB6,.NET, PHP,NODE.JS, Graphic Design, Project Manager, CMS, Quad Electronics. classic cars & m'bikes. Artist in water & oils. Historian.

    By the power invested in me, all the threads I start are battle free zones - no arguing about the benefits of VB6 over .NET here please. Happiness must reign.

  3. #3
    PowerPoster
    Join Date
    Jan 2020
    Posts
    4,458

    Re: Use RC6.Cairo to develop a VSCode-like UI

    use webui by webview2,cef.dll,webkit.dll (3-10mb size),like vscode,twbasic,it's not win32 control,not cairo picture control

  4. #4
    PowerPoster
    Join Date
    Jul 2010
    Location
    NYC
    Posts
    6,328

    Re: Use RC6.Cairo to develop a VSCode-like UI

    VSCode uses the Monaco editor; you can use that in your own IDE like tB does.

  5. #5
    PowerPoster
    Join Date
    Jun 2013
    Posts
    7,413

    Re: Use RC6.Cairo to develop a VSCode-like UI

    To adapt the style (and colors) of the RC6Widgets - you just have to implement the cTheme-interface in your own "cMyWin11Theme"-Class.
    (or wait - until someone else does it for you... it's only styles - which can be applied later).

    As for a CodeEditor-Widget - I have one in the works (based on cwVList), but not yet finished...
    In the meantime you might use cwText (as a simple, non-highlighting mockup) -
    or use your own cWebView2+Monaco based alternative.

    Olaf

  6. #6

    Thread Starter
    Frenzied Member
    Join Date
    Aug 2020
    Posts
    1,538

    Re: Use RC6.Cairo to develop a VSCode-like UI

    Quote Originally Posted by yereverluvinuncleber View Post
    You really ought to be using the original RC equivalents within your forms designer, is this one of the reasons why only Olaf can build it, if you need the original source? Can you not just build the designer using the built-in RC widgets as you would build any normal RC app?
    My designer allows users to build RC6-apps using RC6Widgets, but I want my designer, IDE and VSCode-like product to have a more modern look, I don't want them to look like they were designed in 2010.

  7. #7

    Thread Starter
    Frenzied Member
    Join Date
    Aug 2020
    Posts
    1,538

    Re: Use RC6.Cairo to develop a VSCode-like UI

    Quote Originally Posted by xiaoyao View Post
    use webui by webview2,cef.dll,webkit.dll (3-10mb size),like vscode,twbasic,it's not win32 control,not cairo picture control
    Quote Originally Posted by fafalone View Post
    VSCode uses the Monaco editor; you can use that in your own IDE like tB does.
    Yes, I tested WebView2 and Monaco-Editor in VB6-Form a few years ago and they are fantastic, especially when reading huge code files, for example, Monaco-Editor can read a JS file with 300,000 lines of code at extremely high speeds.

    However, it is not an easy task to operate and control Monaco-Editor in VB6-Form. Also, I've always thought that a desktop-based IDE would have a better user experience than a browser-based IDE. So I decided to develop an IDE based on desktop software.

  8. #8
    PowerPoster yereverluvinuncleber's Avatar
    Join Date
    Feb 2014
    Location
    Norfolk UK (inbred)
    Posts
    2,604

    Re: Use RC6.Cairo to develop a VSCode-like UI

    Modern look should be adaptable by theme-ing as Olaf stated. 'Modern' as a statement is a thoroughly subjective term often misapplied and regardless will be old and out-of-date within a year or so. What you should have is an adaptable theme-ing capability so that any style can be applied to adapt to what 'modern' means at any time in the near future.

    Personally I think what most people think is 'modern' is just ****. You only have had to live through the seventies to have experience of real-life interpretations of the word 'modern'. The last thing I'd ever want is a modern theme. I know I am peculiar but so are many others , we all have our own tastes. Just give the world an interface and allow them to adapt it through theme-ing.

    If I were you I would just start building and see how you can incorporate styles. It'll take you ages in any case and by the time you've finished what is now 'modern' in terms of computer UIs will have been reassessed by Microsoft and other bland corporations and the world will have moved on.

    In my own case, I use PSDs to deliver the UI. Anyone can take my PSD and alter the component visuals to make an alternative UI. I have done that myself with some dieselpunk/steampunk offerings, same code, different PSD. It isn't themes but another really good approach made possible by Olaf.



    Last edited by yereverluvinuncleber; Oct 5th, 2024 at 07:46 AM. Reason: added images
    https://github.com/yereverluvinunclebert

    Skillset: VMS,DOS,Windows Sysadmin from 1985, fault-tolerance, VaxCluster, Alpha,Sparc. DCL,QB,VBDOS- VB6,.NET, PHP,NODE.JS, Graphic Design, Project Manager, CMS, Quad Electronics. classic cars & m'bikes. Artist in water & oils. Historian.

    By the power invested in me, all the threads I start are battle free zones - no arguing about the benefits of VB6 over .NET here please. Happiness must reign.

  9. #9

    Thread Starter
    Frenzied Member
    Join Date
    Aug 2020
    Posts
    1,538

    Re: Use RC6.Cairo to develop a VSCode-like UI

    Deleted
    Last edited by SearchingDataOnly; Oct 5th, 2024 at 09:16 AM.

  10. #10
    PowerPoster yereverluvinuncleber's Avatar
    Join Date
    Feb 2014
    Location
    Norfolk UK (inbred)
    Posts
    2,604

    Re: Use RC6.Cairo to develop a VSCode-like UI

    As an example of a theme-able Editor, see RJTextEd.



    This is how I prefer an editor to look, traditional black on white, icons, configurable font &c. It can look as 'modern' as you wish and actually does so out-of-the-box.

    https://github.com/yereverluvinunclebert

    Skillset: VMS,DOS,Windows Sysadmin from 1985, fault-tolerance, VaxCluster, Alpha,Sparc. DCL,QB,VBDOS- VB6,.NET, PHP,NODE.JS, Graphic Design, Project Manager, CMS, Quad Electronics. classic cars & m'bikes. Artist in water & oils. Historian.

    By the power invested in me, all the threads I start are battle free zones - no arguing about the benefits of VB6 over .NET here please. Happiness must reign.

  11. #11

    Thread Starter
    Frenzied Member
    Join Date
    Aug 2020
    Posts
    1,538

    Re: Use RC6.Cairo to develop a VSCode-like UI

    Great example. VSCode seems to be much more concise and clear than RJTextEd, though. What I'm trying to say is that the reason why I'm trying to mimic VSCode as much as possible is to reduce the learning curve for users.

    Also, I need to finish VSCode-like product as soon as possible, because I have other more important things to do.
    Last edited by SearchingDataOnly; Oct 5th, 2024 at 08:22 AM.

  12. #12

    Thread Starter
    Frenzied Member
    Join Date
    Aug 2020
    Posts
    1,538

    Re: Use RC6.Cairo to develop a VSCode-like UI

    Quote Originally Posted by Schmidt View Post
    To adapt the style (and colors) of the RC6Widgets - you just have to implement the cTheme-interface in your own "cMyWin11Theme"-Class.
    (or wait - until someone else does it for you... it's only styles - which can be applied later).
    We won't be able to achieve a VSCode-like UI just by changing the style of the RC6Widgets. It doesn't matter, I've been working on the VSCode-like UI for a few months, and with a month to go, I'll be able to complete all the user-controls except the CodeEditor-Widget.

    Quote Originally Posted by Schmidt View Post
    As for a CodeEditor-Widget - I have one in the works (based on cwVList), but not yet finished...
    In the meantime you might use cwText (as a simple, non-highlighting mockup) -
    or use your own cWebView2+Monaco based alternative.
    Last year, I finished a CodeView-Widget with highlighting features based on cwVList. However, CodeEditor-Widget and CodeView-Widget are completely different things, and although I have been working on it for several years, I still haven't found the best solution for CodeEditor-Widget.

    A few years ago, you wrote me a Spread-Widget example with only a few dozen lines of code, and then I developed a professional Spread-Widget with 30,000 lines of code based on this simple example code.

    If you could find the time to write me a simple CodeEditor-Widget example, then I believe I can also develop a professional CodeEditor-Widget based on your demo code. This will certainly speed up the development of my RC6-based IDE considerably.

  13. #13

    Thread Starter
    Frenzied Member
    Join Date
    Aug 2020
    Posts
    1,538

    Re: Use RC6.Cairo to develop a VSCode-like UI

    Quote Originally Posted by Schmidt View Post
    To adapt the style (and colors) of the RC6Widgets - you just have to implement the cTheme-interface in your own "cMyWin11Theme"-Class.
    (or wait - until someone else does it for you... it's only styles - which can be applied later).
    I relearned cTheme-interface and cThemeWin7. Yes, cTheme-interface can solve most of the problems. Much appreciated.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  



Click Here to Expand Forum to Full Width