Code selector: a small application to insert code in the IDE editor (drag and drop from a CustomListView).

PaulMeuris

Active Member
Licensed User
EDIT: check out the new version (v1) in message #4 !!
EDIT2: you can find a minor update (v2) in message #5!
EDIT3: check out the new version (v3) in message #6!!! It's a "must have" for all B4X programmers!

In message #17 you can read how to make a snippets library and use it in the new B4J IDE 10 beta!!!


When you want to insert code in the IDE editor you can use some examples from @Erel that are available in the intellisense.
You can click on the copy link and paste that piece of code in the editor where you want it.
code_selector09.png


That is a nice feature but it is not always available.
Time for a code selector application!
code_selector01.png
code_selector06.png
code_selector07.png
code_selector08.png

In this application you can add code snippets to a list and later use those snippets in the IDE editor.
You can drag the text from the list into the IDE editor or any other editor (Notepad++) that accepts the drop.
You can add and delete items from the list or clear the list.
You can load snippets from a text file and save the list to a text file.
You can choose a collection filename to create collection lists.
Positioning the application next to the IDE editor can help you to be more productive.
Thank you @Erel and @stevel05 for the dragging and dropping examples.
The source code is available in the attachment.
It would be nice if members would exchange their lists... or this list feature would be added to the IDE...
 

Attachments

  • code_selector.zip
    6.9 KB · Views: 106
Last edited:

kimstudio

Active Member
Licensed User
Longtime User
In my view this could be quite useful. 👍

May I suggest to add a var replace functionality since most of the copied snippets like this may only have one "Dim xx as" and this "xx" could be replaced by a preferred var name within this snippet.

workflow:
select a snippet, the xx as in "dim xx as " will be automatically shown in one text edit view and if user types in new var name, all xx will be replaced in the snippet copied to clipboard or changed in another text view, then drag or drop or copy.
 

kimstudio

Active Member
Licensed User
Longtime User
By the way, I watched the online meeting recording and "IDE plugin" was discussed. Through the plugin interface the text content (or others) of the IDE editor could be directly obtained and extended. However a plugin support may need many efforts to define the interface, update and change of the B4X IDE, and the plugins may need other programming language to program like a form of a DLL under Windows, I assume a tool like this via clipboard can also help to extend the IDE with more functionalities. I remember @William Lancee also make one for color values.
 

PaulMeuris

Active Member
Licensed User
Thank you @kimstudio for your suggestion.
I have modified the application. You can now change a variable name in the text.
First select the text by clicking in the text area. A red bar and arrow will appear.
Then fill the text fields and then click on the "Go!" button.
The text will be changed if the find variable name was found.
The find/replace operation can give strange results when replacing single letters (a for loop variable i for instance).
It will be OK if there are no other words with the letter present in the text.
The replace function is case-sensitive!
You can find the source code of this version (v1) in the attachment.
1694316485762.png
1694316525949.png
1694316565295.png

1694316589878.png
1694316886697.png
1694317003231.png

1694317024594.png
 

Attachments

  • code_selector_v1.zip
    7.6 KB · Views: 91
Last edited:

PaulMeuris

Active Member
Licensed User
You can find some code snippets files in the attachments.
Load a file in the Code Selector application and drag some items to the B4J IDE editor.
You can change some variable names if you have the version v1 of the application.
When loading a file i have noticed that the sequence of the snippets was not the same as the sequence in the file.
I used the InsertAt method from the CustomListView (CLV) in the Load subroutine.
In the attached version v2 this has changed to the Add method from the CLV so that the sequence from the file is preserved in the CLV.
Shall i make a thread where you can share your lists with other members?
 

Attachments

  • code_snippets_B4J_CustomListView.txt
    1.2 KB · Views: 93
  • code_snippets_B4J_files.txt
    1.5 KB · Views: 94
  • code_selector_v2.zip
    7.6 KB · Views: 90

PaulMeuris

Active Member
Licensed User
When you use the application that you wrote then you can see what is missing.
In this new version the items in the CLV can be expanded or collapsed with the green button.
The height of each expanded item has also increased to 200 dip.
The text area can contain minimum 7 visible lines when the item is expanded. You can scroll to see the rest.
The source code of this version (v3) is available in the attachment.
The list you see in the images is also available in the attachment.
Feel free to download it and add to it in the Code selector application!
code_selector11.png
code_selector12.png
 

Attachments

  • code_selector_v3.zip
    7.9 KB · Views: 92
  • B4J_list.txt
    1.4 KB · Views: 87

BasicBert

Member
Licensed User
Longtime User
This looks quite usefull to me. But where can I find the Draganddrop library that's being used in this project?
I have checked and searched with the search-function in the forum, but can't find it.
Please help.
 

BasicBert

Member
Licensed User
Longtime User
Always good to have an alternative.
I'll take a look at it later this weekend. LucaMs.
Thank you.
 

PaulMeuris

Active Member
Licensed User
In the new release from the B4J IDE B4J 10 beta you can use code snippets.
You can organize them in b4xlib files.
Create a folder and name it Snippets.
Open an editor (Notepad++) and create a new text file.
Use the Code Selector application and select a snippet.
Change the variable names to $<variable name>$ using the go! button.
When all the variable names are changed you can drag and drop that snippet in the text file from the editor.
Save the text file in the editor to the Snippets folder (using a good file name).
Repeat the process for all the other snippets in the Code Selector list.
Use a zip-tool to create a zip-file from the Snippets folder and rename the zip file to for instance ListSnippets.b4xlib
Copy that library file to the Additional Libraries folder (or in my case to the sub folder B4J of that Additional Libraries folder).
Now when you open a project in the B4J IDE you can select the ListSnippets.b4xlib in the Libraries Manager panel.
In the editor window of the B4J IDE you can then start typing list... or code... and a list will appear.
1695370708253.png

Select a snippet from the list and the snippet content will appear.
1695370863722.png

You can use the TAB key to go to each variable name to type the correct name.
When you press ENTER you accept the changes and the cursor will be at the location of the $end$ variable from the snippet (if specified).
This is a really cool addition to the B4J IDE.
In the attachment you can find the ListSnippets.b4xlib library file i used in this example.
 

Attachments

  • ListSnippets.b4xlib
    3.7 KB · Views: 75
Top