DEV Community: Amr Hesham

How i created a query language for .git files (GQL)

Amr Hesham — Thu, 08 Jun 2023 15:48:15 +0000

Hello everyone. Last month I got interested in Rust programming language and want to discover more about it. So I started to learn the basics and started to see the open source projects written in Rust. I also created one PR in the rust analyzer project; it does not depend on my knowledge of rust but on my general knowledge of Compilers and Static analysis. As usual, I love to learn new things by creating new projects with ideas that I am interested in.

The idea

I started to think about small ideas that I love to use, for example, a faster search CLI or some utility apps. But then I got a new cool idea.

While reading the Building git book (a book about building git from scratch), I learned what each file inside the .git folder does and how git store commits, branches and other data and manage its own database. So what if we have a query language that runs on those files?

The Git Query Language (GQL)

I decided to implement this query language, and I named it GQL. I was very excited to start this project because it was my first time implementing a query language. I decided to implement it from scratch, not converting .git files into an SQLite database and running normal SQL queries. And I thought it will be cool if, in the future, I can use the GQL engine as a part of a Git client or analyzer.

The implementation of GQL

The goal is to implement it into two parts. The first one is converting the GQL query into AST of nodes, then passing it to the engine to walk and execute it as an interpreter or in the future to convert this into virtual matching for GQL Byte code instructions.

The engine has the functionality to deal with .git files using the rust binding for git2 library so it can perform selecting, updating and deleting tasks, also storing the selected data into a data structure so we can perform filtering or sorting.

To simplify this implementation and I created a struct called GQLObject that can represent commit, branch, tag or any other object in this engine also to make it easy to perform sorting, searching, and filtering with single functions that deal with this type.

pub struct GQLObject {
  pub attributes: HashMap<String, String>,
}

The GQLObject is just a map of string as a key and value, so it can be general to put the info of any type. And now features like comparisons, filtering or sorting can be implemented easily on this strings map.

The current state

Over the last week, I implemented the selecting feature with conditions, filtering and sorting with optional limit and offset so you can write queries like this

select * from commits
select name, email from commits
select name, email from commits order by name
select name, email from commits where name contains "gmail" order by name
select * from commits where name.lower = "amrdeveloper"

select * from branches
select * from branches where ishead = "true"
select * from branches where name ends_with "master"
select * from branches where name contains "origin"

select * from tags
select * from tags offset 1 limit 1

The next step

Now the next step is to optimize the code and start to support more features, for example, imaging query for deleting all branches except the master.

delete * from branches where name ! "master"

Or pushing all or some branches to a remote repository using a single query. Maybe grouping and analyzing how many commits for each user in this month and many other things we can do.

Github: https://github.com/amrdeveloper/gql

I am looking forward to your opinion and feedback 😋.

I hope you enjoyed my article and you can find me on

You can find me on: GitHub, LinkedIn, and Twitter.

Enjoy Programming 😋.

I created a programming language and created games with it

Amr Hesham — Mon, 24 Apr 2023 14:43:40 +0000

Hello everyone, today I will share with you the story about my programming language Amun, which is an open source low level general purpose language that compile to machine code using LLVM Framework.

The story begins two years ago, when I am as a self taught software engineer learning the subjects of computer science and in this time, I started to learn about Compiler design for the first time from Courses and Books, I created many small programming languages some of them are for specific goals like creating bots, drawing shapes …etc

I really loved the career of Compiler engineer and started to learn more about it, reading source code, try to design new features, watching live streams about compilers.

In the last year, I got the idea to design a high performance language that should be fast as C/C++ but to be very simple and easy to learn, also to give you some features to create good libraries and DSL (Domain specific Languages).

I already created a design for a small language with some features and concepts inspired by other languages such as C/C++, Go, Rust, Jai, Swift, Kotlin, and I started to simplify this design and named it Jot.

What I want is a language that is simple as C and Go, no preprocessor, no garbage collection (remember I need a high performance language).

It also has such as Type inference and Generic Programming support, Compile time stuff, lambda expression, operator overloading, infix, prefix and postfix functions inspired by Swift, and some cool other features for examples.

Lambda expression with the ability to move lambda moved out of parentheses in function call and constructor

var lambda = { printf("Hello from lambda!\n"); };

fun let(value *void, callback *() void) {
    if (value != null) {  callback(); }
}

fun main() {
   let(null) { 
       printf("Will never printed");
   }; 
}

Also, to come up with an easy way to iterate over arrays and strings.

for array { printf("array[%d] = %d\n", it_index, it); } 
for item : array { printf("array[%d] = %d\n", it_index, item); }
for item, index : array { printf("array[%d] = %d\n", index, item); }

Tuples so you can create a collection of different type values and use it to make a function that return more than one type

var tuple = (1, 2, "Hello", 3, 4, "World");

fun max_min(x int64, y int64) (int64, int64) {
   return if (x > y) (x, y) else (y, x);
}

One of the most important goals is to have a cool and helpful compiler like rust, it should tell you messages that help you yo not only fix the bug but also understand more about problem and the language.

After some research, I found that the easiest way to create a high performance low level language is to use the LLVM Framework as a backend for the compiler so it can optimize and generate machine code for most of platforms. So I started to learn more about LLVM from Books and created a few projects with it.

In June 2022 I started to work on the compiler, and I decided to create it using C++ for many reasons such as high performance and LLVM is also created using C++ so I can easily found samples written in C++, also because I have some experience using it.

In Jan 2023 the language had most of the features that can help you to provide any programs that you can create in C but without Macros and i started to create simple programs and link with libraries such as OpenGL and Raylib to create simple GUI Applications.

Then I started to work on features that can make creating libraries and applications easier, such as tuples, operator overloading, lambda, type alias, directives and also improve the compiler error message, I can’t covering all features in this article but I will write about them latter with cool samples.

After testing the features i ported a Pong game written using C++ and Raylib in my language and this is the result.

Until this step, the language name was Jot, but I was surprised that there is already a language with the same name, so I searched for a new name, and I named it Amun. The name is inspired by Ancient Egyptian mythology when Amun was the chief deity of the Egyptian Empire.

The language is now still in development and everyone is most welcome to contribute to it. You can help with documentation, compiler, samples …etc.

You can follow the development on the GitHub repository, and there are more than 200 samples to over all language features, so feel free to star the project if you loved it.

Github Repo: https://github.com/AmrDeveloper/amun

Enjoy Programming and creating cool stuff 😇

Short circuit evaluation and why it’s important

Amr Hesham — Fri, 03 Feb 2023 20:22:23 +0000

Hello everyone. In this article, I want to talk about a concept that is used in many programming languages and how to take advantage of it. It has many names like McCarthy evaluation or minimal evaluation, but the most popular name is Short circuit evaluation.

What is Short circuit evaluation?

Before we answer this question, let’s first think of two situations,

if (first && second) { }

In this code snippet, if the first condition is evaluated as false, does the value of the second one matter to check if it should evaluate the if body or not? or what if the first condition is evaluated as true and the operator is Or (||) not and does we need to evaluate the second?

The answer for both questions is no because in And (&&) expression, if one of the values is false, that means the condition will be evaluated as false; no matter the other value is true or false, and in Or (||) expression if the first one is true no need to check the second value, in all cases it will return true

false && true   --> false
false && false  --> false
true || true    --> true
true || false   --> true

In most programming languages, the process of evaluating the second argument depending on the first one is automatically handled for you and it called Short-circuit evaluation.

How can you take advantage of Short circuit evaluation?

If you have a validation function that depends on more than one condition, for example, you check that a user password has a length of more than 8 characters and then match it with the Regex pattern, the performance of this validation function can be different depending on the order of the conditions.

You can have two options to order those conditions like

public static boolean lengthFirst(String password) {
    return password.length() > 8 && pattern.matcher(password).matches();
}

public static boolean regexFirst(String password) {
     return pattern.matcher(password).matches() && password.length() > 8;
}

If we pass a valid password, the two functions will be the same, but what if we pass the wrong one? which one can be faster, and how fast can it be comparing to the other one? let’s check!

String input = "one";

long lenStart = System.nanoTime();
lengthFirst(input);
long lenEnd = System.nanoTime() - lenStart;
System.out.println(lenEnd);

long regexStart = System.nanoTime();
regexFirst(input);
long regexEnd = System.nanoTime() - regexStart;
System.out.println(regexEnd);

This code snippet will print the time of executing each validation function, the output on my machine is

6800
773900

That means the first function is about 113 times faster, but why?

This difference is because checking string length is much faster than matching it with regex, try to compare them and check the differences you will get almost the same result.

That means to take advantage of Short circuit evaluation, you need to think carefully about the order of your conditions.

How to order conditions to get more performance?

When you write expressions with multi conditions, you should think about how you can avoid evaluating the big conditions or, in other words, try to evaluate the small conditions first so if they return false, you can avoid the others.

Summary
Short circuit evaluation, like many other useful programming concepts, is not hard and gives you much more performance

Enjoy Programming 😋.

How Code formatter implemented in Turtle Graphics

Amr Hesham — Thu, 03 Nov 2022 17:35:21 +0000

Hello everyone, in the last article I introduced the Turtle Graphics Android App project with implementation details and resources about the scripting language, editor, generating documentation…etc, after I published the app and got more than 2000 downloads a few times and good ratings and feedback, I decided to add support for code formatting and in this article, I will talk in detail how simple code formatter work and how I implemented in Turtle Graphics app

As programmers Code formatter are an essential tool in our day-to-day jobs, They make it more easier to read the code if it is formatted, but did you ask yourself how it works?

Before talking about Code formatter, lets first talk about how Compilers represent your code from text to data structure to do the process on it such as type checking.

Lets start our story from your file that contains a simple hello world example

fun main() {
   print("Hello, World!")
}

The first step is to read this text file and convert it into a list of tokens, A token is a class that represents keyword, number, bracket, string, …etc with this position in the source code for example

data class Token (
   val kind : TokenKind,
   val literal : String,
   val line : Int,
)

We can also saved the file name, column start and end so when we want to report error we can provide useful info about the position for example

Error in File Main Line 10: Missing semicolon :D

This step called scanner, lexer or tokenizer and at the end we will end up with List of tokens for example

{ FUN_KEYWORD, "fun", 1 }
{ IDENTIFIER, "main", 1 }
{ LEFT_PAREN, "(", 1 }
{ RRIGHT_PAREN, ")", 1 }
{ LEFT_BRACE, "{", 1 }
{ IDENTIFIER, "print", 2 }
{ LEFT_PAREN, "(", 2 }
{ STRING, "Hello, World!", 2 }
{ RRIGHT_PAREN, ")", 2 }
{ RIGHT_BRACE, "}", 3 }

The result is list of tokens

val tokens : List<Token> = tokenizer(input)

Note that in this step we can check for some errors such as un terminated string or char, un supported symbols …etc

After this step, you will forget your text file and deal with this list of tokens, and now we should convert some tokens into nodes depending on our language grammar for when we saw FUN_KEYWORD that means we will build a function declaration node and we expect name, paren, parameters …etc

In this step, we need a data structure to represent the program in a way we can traverse and validate it later and it is called Abstract Syntax Tree (AST), each node in AST represent statement such as If, While, Function declaration, var declaration …etc or expressions such as assignments, unary …etc, each node store required information to use them later in the next steps for example

Function Declaration

data class Function (
   var name : String,
   var arguments : List<Argument>,
   var body : List<Statement>
)

Variable Declaration

data class Var (
   var name : String
   var value : Expression
)

This step is called parsing and we will end up with an AST object that we can use latter to traverse all nodes.

var astNode = parse(tokens)

If the language statically types such as Java, C, Go …etc we will go to the Type Checker step, the goal for this step is to check that the user use type correctly for example, if the use declare a variable with int type it should store only integers on it, the if condition must be a boolean type or an integer in a language like C …etc

After this step, we will end up with the same AST node but now we know that it is valid and we can now compile it to any target or evalute it, But also we can do the formatting, static analysis, optimization, check code style …etc

For example suppose that we want all developers to declare variables without using _ inside the name, to check that we will traverse our AST node to find all Var nodes and check them

fun checkVarDeclaration(node : Var) {
   if (node.name.contains("_") {
      reportError("Ops your variable name ${node.name} contains _")
   }
}

But now we need to format it, so how to do that? It's the same we traverse our AST and for each node, we will write it back to text but formatted for example

fun formatVarDeclaration(node : Var) : String {
   var builder = StringBuilder()
   builder.append(indentation)
   builder.append("var ")
   builder.append(node.name)
   builder.append(" = ")
   builder.append(formatValue(node.value))
   builder.append("\n")   
   return builder.toString()
}

In this simple method, we rewrite the node to string but with correct indentations and add a new line after it so now 2 variables are declared in the same line, the value also is formatted using another function you can use Visitor design pattern to make it easy to handle all nodes.

At the end of this step, we end up with a string that represents the same input file but formatted and then we write it back to the file.

This is the basic implementation of code formatter, a real production code formatter must handle more cases for example what if the code is not valid?, should i format only valid code? should we read the whole program every time we want to format or compile the code?

Now back to Turtle graphics, In this project i already done all the required steps before and has a ready AST, so i just rewrite it with code like you saw above ^_^ i read it from the UI format it and write it back to UI in my case

If you are interested and want to read more I suggest

Read at last one Compiler book such as Craftring interpreters
Read about Language Server Portcol (LSP)
Watch Typescript Compiler explained by the Author Anders Hejlsberg
Think if you have Your program as AST what else you can do with it

I hope you enjoyed my article and you can find me on

Enjoy Programming 😋.

Turtle Graphics implementation for Android

Amr Hesham — Fri, 15 Jul 2022 10:36:29 +0000

Hello everyone, in this article I want to introduce my last side project which is called Turtle, the project idea is totally inspired by the Turtle Graphics Project.

What is the Turtle Graphics project?

Today you may know Turtle graphics from the turtle implementation in the standard library in Python that allows you to control one or more turtles in a two-dimensional space, but the original one first appeared in the late 1960s as a key feature of the programming language called Logo which designed in 1967 by Wally Feurzeig, Seymour Papert, and Cynthia Solomon, you can read more information about Logo and some modern derivatives from wikipedia.

After I played with the turtle module in python and loved it, I searched on google play for Android Version with the same idea so I can have instructions, variables, control flow, data structures…etc, and I didn’t find any app with those features, so I decided to implement one as a side project.

The first step is to have a programming language easy to write and understand the syntax so i created a small one with syntax like python and I called it Lilo (the name is from Lilo and Stitch animation and like logo), so we can have functions, if, loops, variables, constants and a set of instructions for drawing and control the colors but for now you can only control one turtle so here is one example to draw Rainbow Benzene in Python and Lilo.

The Python version

The Lilo version.

The result will be like this

Lilo also provide a clean error and warns messages with line and column numbers so you can easily correct your script.

If you are interesting in a created programming language like Lilo you can start with those two amazing books

1 — Crafting Interpreters by Robert Nystrom

2 — Writing An Interpreter In Go by Thorsten Ball

The next step after I created the programming language was to create a code editor for it and a preview screen, for the code editor I used the CodeView library to provide highlighter, auto complete, snippets, error and warn highlighter and for the diagnostics messages, I used TreeView library so you an expand or collapse errors, warns or both easily.

for the preview screen I have created a simple custom view that can take the Lilo executor and draw the result you can check the code from here.

After that I implemented a documentations expanding list easily by generating it using EasyAdapter library and also I implemented save, update, search, and delete your lilo scripts as a lilo packages with some extra meta data.

Turtle Android App is available now on Google Play and the source code on Github so you are welcome to suggest features, report bugs, and contribute.

Google play: Turtle Graphics App

Github: AmrDeveloper/turtle

Here is demo video for turtle app that convert many python examples to lilo check it from here.

Enjoy Programming 😋.

A new Android TreeView implementation

Amr Hesham — Thu, 07 Apr 2022 08:08:53 +0000

Hello everyone, at the start of 2022 I want to create a files tree as you see in any code editor or IDE that represents the project structures and you can do some operations like expanding or collapsing directories, and I have searched for many Tree View implementations in GitHub but I found that some of them are not maintained from many years and also the example project didn’t run on new Android Studio versions, other implementations create custom views from scratch and draw the tree but they didn’t work correctly with a big number of nodes and other limitations.

So I started to create a list that contains a set of features from all of them, and also a set of features that were requested on the GitHub Issues to get inspiration from them so I can create a generic and useful implementation that can be easy to customize and extend by everyone and as a result of this I want to introduce This new TreeView library.

The main goal is to make TreeView easy to use, customize and extend almost without limitation and to be up to date with the new android versions, so what you can do with TreeView?

TreeView didn’t have any custom view, all you need is a normal RecyclerView so you can get the benefits of RecyclerView recycling and performance, also you can get 2D Scrolling without any custom layout, think of it like you want to make your normal RecyclerView have 2D Scrolling, TreeView has a custom RecyclerView Adapter with click and long click listeners ready to use and we can add more in the future, so each TreeNode didn’t need to have a reference for it listeners.

You can have any number of roots, and also any number of list items layouts without the need to extend and override the default adapter, I have implemented using the Factory design pattern so you need to pass a TreeViewHolderFactory to the adapter constructor that maps each list item layout with it ViewHolder, so all you need is to create a View Holder for this layout and add it to the factory.

TreeView also supports many operations like expanding and collapsing nodes and branches or by levels also has expanding and collapsing all nodes, you can also get the currently selected node and the parent for any node, all of those features implementation is encapsulated in the TreeNodeManager class so we can easily write a unit tests for them, also if you want to have different implementation you can easily create a custom TreeNodeManager and pass it to the adapter.

All of the details about how to install, use and extend are written on the TreeView website with examples and if you face any problems or have any questions, please feel free to create a new issue on the Github repository so we can help you quickly.

This implementation is ready to use and if you have any ideas or requirements feel free to share them or contribute and add them, also you will find all details on the website.

TreeView Github: AmrDeveloper/TreeView
TreeView Website: Github.io/TreeView

You can find me on: GitHub, LinkedIn, Twitter.

Enjoy Programming 😋.

How to create Adapters easily in 2022 as an Android Developer

Amr Hesham — Wed, 02 Feb 2022 09:46:12 +0000

Hello everyone, in Android Development almost every project has one or more adapter classes to deal with a collection of views, also there are many different types of adapters such as RecyclerAdapter, ListAdapter, Paging2 Adapter, Paging 3 Adapter, ArrayAdapter, ExpandableListAdapter, some times you need to create a complex adapter class, but most of the times all you need is to bind your model class with a list item layout and provide some extra listeners and that's it, so why we can't automate the process of creating those adapters classes?

Before talking about how we will automate it, lets first talk about what feature we want and what problems we want to avoid.

So let's start with the features?

Declare how to bind data to views easily.
Add listeners to any view or to the main list item layout view.
Support some features like loading images with third party libraries like Picasso, Glide, COIL.
Support default and custom names for the Adapter class.
Provide clear error messages if we made any mistakes.

And what problem we want to avoid by using this solution?

Add any cost to the runtime.
Writing complex code to deal with this solution.
Slow build time.
Hard to learn.
limitation.

So now what is this solution?

The solution is EasyAdapter which is a new Android Annotation Processing library that can generate adapter classes based on your model class and your custom information in the compile time only.

So how does it work?

EasyAdapter has only 2 types of Annotations which are Adapters and Binds Annotations, the first type is used to annotate the model class to tell EasyAdapter what type of adapter you want to generate from this model and what list item you want to use for example

@ListAdapter("com.amrdeveloper.app", "list_item_model")
class Model

This example tells the library that you want to generate ListAdapter for the Model class and use R.layout.list_item_model as a list item, you also can change the generated name for example.

@ListAdapter("com.amrdeveloper.app", "list_item_model", "ModelAdapter")
class Model

And in version 1.0.0 EasyAdapter provides 6 Adapter types which are

ArrayAdapter
ListAdapter
RecyclerAdapter
PagedListAdapter
PagingDataAdapter
ExpandableListAdapter

You can also find full documentation about them with examples on the documentation website

The second annotation type is Bind Annotations and they used to bind or provide features

For example to tell EasyAdapter that you want to use this string field as a text for TextView with id R.id.user_name you can use @BindText

@BindText("user_name") val name : String

and this code will generate a code to load the image with path imagePath inside ImageView class with id R.id.user_avatar

@BindImage(ImageLoader.PICASSO, "user_avatar")
val imagePath : String

You can also use @BindListener annotation on the model class to generate listener for any view for example

@BindListener(ListenerType.OnClick) @BindListener(ListenerType.OnClick, "call_button")
...
class Model

EasyAdapter now will generate 2 on click listener the first one for the list item itself and the other for view with id R.id.call_button

In Version 1.0.0 10 Bind Annotations which are

BindText
BindImage
BindImageRes
BindBackgroundColor
BindBackgroundRes
BindAlpha
BindGif
BindVisibility
BindListener
BindExpandable
BindExpandableMap

You can also find a full documentation about them with examples on the documentation website

Using EasyAdapter is not hard as you can see and you can learn it easily in minutes.

But How EasyAdapter really works?

EasyAdapter has support for 2 Annotation Processors Kapt (Kotlin Annotation Processing Tool) and KSP (Kotlin Symbol Processing) to walk in your source code and collect information from the annotations with simple type checking to make sure for example what @BindImage annotate string field which represent the image path, show error and warn messages if needed, and after we have all the required information we used code generators that generate the result adapter class source code using kotlinpoet library from Square then we write this source code in Adapter files inside the output directory:D. we try to make the generated code as optimized as possible for example we avoided calling mutable findViewById with the same id, Instead of that we have a ViewTable class inspired from the SymbolTable concept to manage the declared variable and reuse them again.

This is just the first version, and everyone is welcome to help to improve this tool by suggesting features, reporting issues and contributing to the code base or documentation, everyone can add value.

Github Repositroy: AmrDeveloper/EasyAdapter
Website: EasyAdapter

Enjoy Programming 😋.

Functional Interfaces in Kotlin

Amr Hesham — Sun, 09 Jan 2022 21:17:31 +0000

Hello everyone, almost all of us have seen code like view.setOnClickListener { } or view.setOnLongClickListener { } in Kotlin, and when you click on it to see the source code it will show you the Java OnClickListener interface. But have you asked yourself what is this syntax? Is it a kotlin extension? and how can you call your custom listener like this? In this small article, you will know the answer to all of those questions, so let's start 😋.

This syntax is not an extension but SAM conversion, but what does SAM stand for?

SAM stands for Single Abstract Method interface and it’s called also Functional interface which is an interface with only one non-default method and any number of default methods, for examples In the JDK we have Runnable class which has only one method called run and in Android SDK we have OnClickListener, OnLongClickListener …etc.

How can we create a custom functional interface?

To declare a Functional interface in Java it is easy you just create a normal interface with one method for example.

public interface FunInterface {
    void method();
}

And in Kotlin starting from Version 1.4 you need to declare it as a fun interface not only interface for example.

fun interface FunInterface {
    fun method()
}

In Kotlin you can use Java or Kotlin Functional interfaces as a Lambda expression for example.

fun learnFunInterface(fi : FunInterface) { ... }

To you this function you can pass FunInterface as an anonymous object for example.

learnFunInterface(object : FunInterface { 
    override fun method() {
        println("Hello") 
    } 
})

But because it Functional Interface you can pass it as lambda { } and this is what is called SAM conversion.

learnFunInterface ({ println("Hello") })

also in Kotlin if your last parameter is functional interface you can move your lambda out the brackets ( ) for example.

learnFunInterface {
    println("Hello")
}

Now you can realize that setOnClickListener { } is just because this method takes functional interface which is OnClickListener as a parameter.

Note that the same syntax will work on Kotlin also if your functional interface is written in Java like OnClickListener.

Extra Resources:

Enjoy Programming 😋.

Android CodeView: Auto Intending, Find and replace

Amr Hesham — Sun, 09 Jan 2022 21:13:57 +0000

Hello everyone, In this article, I will talk about two features from the newest version of the CodeView library which are support auto-indentation, and adding support for finding matching and replacing keywords.

Note that you can find full documentation about how to install and use CodeView in the AmrDeveloper/CodeView official Repository.

So first what is Auto Indentation?

Auto indentation helps you to set the level of indentation when you type new text, indentation level will automatically increase or decrease by the tab length for example by 4 when you insert new lines in the end or in the middle of the text.

For example in the modern IDE when you write java when you start writing new multi-lines block with { the indentation level will increase by tab length for example 4 and once you end this block with } the indentation will decrease.

To support this feature in CodeView you can do it only in 3 steps.

Step 1: set the indentations start characters, so when the user type those characters the indentation level should increase for example {.

Set<Character> indentationStart = new HashSet<>(); indentationStart.add('{'); codeView.setIndentationStarts(indentationStart);

Step 2: set the indentations end characters, so when the user type those characters the indentation level should decrease for example }.

Set<Character> indentationEnds = new HashSet<>(); indentationEnds.add('}'); codeView.setIndentationEnds(indentationEnds);

Step 3: set the tab length and enable the auto indenting.

codeView.setTabLength(4);
codeView.setEnableAutoIndentation(true);

You can easily change the highlighting color

codeView.setMatchingHighlightColor(color);

Now we have done :D, Enjoying Auto indenting.

The second feature is inspired by a Feature suggestion from a user of CodeView, which is the ability to highlight and get the matched substring and also replace it with another text easily, this feature you can also see in the modern Code Editors and IDE’s like Vs Code, Android Studio…etc.

So now CodeView provide some methods to help you implement find and replace dialog.

To get all the matched substrings from the text you can use findMatches.

List<Token> tokens = codeView.findMatches(regex);

To Find and highlight the next matching token, returns null if not found.

Token token = codeView.findNextMatch();

To Find and highlight the previous matching token, returns null if not found.

Token token = codeView.findPrevMatch();

To Clear all matching highlighted token.

codeView.clearMatches();

To Replace the first string that matches regex with other string.

codeView.replaceFirstMatch(regex, replacement);

To Replace all strings that match regex with other string.

codeView.replaceAllMatches(regex, replacement);

In the example app on GitHub, you will find dialog that use this feature to support find and replacement

Enjoy Programming 😋.

Android CodeView: Create a code editor with Snippets

Amr Hesham — Wed, 01 Dec 2021 21:11:07 +0000

Hello everyone, I am Amr Hesham a Software Engineer, I am interested in Android Development and Compiler Design, in the last few articles I showed you some cool features on how to use the CodeView library to create your own code editor for your custom language or data format with syntax highlighter, autocomplete, error and warn highlighter, highlight search result …etc. and in this article I will show you how to implement code snippets in your editor easily using CodeView 1.1.0.

Snippets or Live Templates are very useful features and you can find them in most of the modern Code editors and IDE’s like Visual Studio Code and all of JetBrains IDE’s such as Android Studio, IntelliJ IDEA because it helps us to write repeating code patterns easily with few characters and help you write code faster, and this feature will be very needed in your Code Editor App to make the user write fast on the Mobile Device, when you type for and the IDE write for loop for you that’s what is called snippets.

Starting from version 1.1.0, CodeView help you to support snippets easily with few lines of code, Let’s start by implementing our example, in this example, we want to help our Java Developers users to start writing code fast, so our goal is when the user clicks on snippet with prefix ‘main’ we will insert the Hello World code for them.

To learn how to add CodeView in your project and how to create a highlighter for Java please check this Article and the official repository, so we can focus on the Code Snippets feature.

Github Repository: AmrDeveloper/codeview.

After you implement Java Highlighter it’s time to add your keyword and snippets.

In the CodeView library keywords and snippets are classes that implementing the Code interface.

public interface Code {
    String getCodeTitle();
    String getCodePrefix();
    String getCodeBody();
}

This class has three attributes title, prefix and body, It’s important to know the difference between them

The title is that text that you see on the autocomplete dropdown menu so it can be for example “Keyword Package”.
The prefix is that text that we use it for filtering in the autocomplete adapter for example “package”
The body is what we inserted in the code when the user types a string that is a subset of the prefix and then he clicks on the title for example “package main;”

You will understand the different Cleary when we write some examples, so lets start by the first example.

First, you need to create a list that contains all your keywords and snippets.

String mainPackageTitle = “Main Code”;
String mainPacakgePrefx = “main”;
String mainPackageBody = “package main;\n\npublic class Main {“ +
 “\n\tpublic static void main(String[] args){“ +
 “\n\t\tSystem.out.println(\”Hello, World!\”);\n\t}\n}”;
List<Code> codes = new ArrayList<>();
codes.add(new Snippet(mainPackageTitle, mainPacakgePrefx, mainPackageBody));

Then you need to create CodeViewAdapter and set it to CodeView object.

CodeViewAdapter codeAdapter = new CodeViewAdapter(this, codes);
codeview.setAdapter(codeAdapter);

Here we created our snippet with prefix ‘main’ so once the user input is a subset of ‘main’ the user will see “Main Code” option in the AutoComplete dropdown menu and once he chooses it the hello world example will be inserted in Code View editor and the final result will be like this.

You can add as many snippets as you want, but what if you want the autocomplete drop down menu to show snippets and keywords together, That’s easy because both classes are Code type soo you can add both of them to the list.

List<Code> codes = new ArrayList<>();
codes.add(new Keyword(.., .., ..));
codes.add(new Snippet(.., .., ..));

That’s easy and you can extend this example so you can give the user the power to define his keyword and snippets! and your work is just inserted them on the list and pass it to the CodeViewAdapter.

For users of Versions before 1.1.0, you still have the old option to create autocomplete feature with an array of strings using the normal ArrayAdapter, so your old code will not break.

In the end I hope that you loved this feature, you can check the full documentation and example of CodeView in the GitHub repository, if you love it give it a star and you are most welcome to suggest features, report bugs, write articles, contribute to the code.

You can find me on: GitHub, LinkedIn, Twitter.

Enjoy CodeView and Programming 😋

Regex Named Groups and Backreferences

Amr Hesham — Mon, 29 Nov 2021 07:12:38 +0000

Hi, I am Amr Hesham a Software Engineer, I am interested in Android Development and Compiler Design, In this article, I will talk about very good and useful feature which is Regex Named group and Backreferences with examples,

Regex Named group and Backreferences introduced first time in Python re module then Microsoft developers supported it in .NET with different syntax, and Java supported it from JDK 7, Now it supported in most of the modern programming languages like Ruby, PHP, R …etc,

This feature helps you to group your regular expressions with name and reference to those groups later in the regex, to learn more about the history of this feature and more details I recommend checking regular-expressions.info tutorials written by Jan Goyvaerts.

Let’s start with examples about how to define a named group and get group by name and by index, I will use Kotlin programming language, the concepts are the same, bug as i said before but some non JVM languages have different syntax for the same feature.

Suppose we want to parse color attributes in our Android project color.xml file and print each color name and value, for example here we have 3 colors.

<color name="black">#000000</color>
<color name="white">#ffffff</color>
<color name="grey">#cccccc</color>

And we want to print

black #000000
white #ffffff
grey #cccccc

We can do this task using many different techniques, but I will show you how to do it using regex named groups easily.

First, we need to create a regex that matches each attribute normally, each attribute contains type, name and value like this

value

So the normal regex will be

<\\w+ name=\"\\w+\">.+</\\w+>

You can use Regex101.com to test your regex easily and understand it, but make sure you use selected Java 8 flavor.

Now after we created our regex we need to group the information that we need to get them,

What we need is attribute name and value, so just put their regex inside ( ) like this

<\\w+ name=\"(\\w+)\">(.+)</\\w+>

Now attribute name will be in group number 1 because group number 0 contains the full text which is matched by our full regex and attribute value on group number 2,

To get information first, We will compile this pattern

val pattern = Pattern.compile(attributePattern)

Then we will get every substring that matches our pattern, and get the 2 groups 1 and 2

val matcher = pattern.matcher(text) 
while (matcher.find()) {
    val attributeName = matcher.group(1)
    val attributeValue = matcher.group(2)
    println("$attributeName $attributeValue")
}

That’s it!! and the output will be exactly what we want.

To use grouping by name all you need is to add a name for each group, just add ? inside your group for example.

<\\w+ name=\"(?<KEY>\\w+)\">(?<VALUE>.+)</\\w+>

Group name must be an alphanumeric sequence starting with a letter and you can’t name two groups with the same name.

Now instead of getting group by index like 1, 2 we will use KEY and VALUE,

while (matcher.find()) {
    val attributeName = matcher.group("KEY")
    val attributeValue = matcher.group("VALUE")
    println("$attributeName $attributeValue")
}

And you will get the same output :D.

Now after we learned about what is named groups and how we can use it, it’s time for Backreferences.

Basically Backreferences used to match the same text as previously matched by a group, for example suppose we want to check if a number contain only one repeated digit like 1, 22, 333, 444 so how we can do this using Regex,

To use Backreferences first we need to define a group and our group in this case will be one digit (?\d), so this will match the first digit right, then we will use Backreferences to check if all other digits are the same as the matched text for our first one, to do this you can use ‘\k’ or by index like ‘\1’.

Our full regex will be “(?\d)\k” or “(\d)\1” this means we expect one digit with a group DIGIT and zero or more of the same digit that matched by this group, full code will be like this

fun main() {     
    val repeatedDigitRegex = "(?<DIGIT>\\d)\\k<DIGIT>*"
    val pattern = Pattern.compile(repeatedDigitRegex) 
    println(pattern.matcher("1").matches())
    println(pattern.matcher("22").matches())
    println(pattern.matcher("333").matches())
    println(pattern.matcher("4444").matches())
    println(pattern.matcher("10").matches())
    println(pattern.matcher("21").matches())
    println(pattern.matcher("101").matches())
}

And output will be

true true true true false false false

There are many ideas that can be created using this feature for example check if HTML start and closed by the same tag, check if anything is repeated …etc

There is another useful method called replaceAll from matcher class, it can replace the current matched substring with any string or with group matched text using references, for example in the last example if we want to replace all the repeated digits with only one of them, so we need to replace the regex with just the first group of it.

So instead of using matches we will use replaceAll and pass the group reference by a number which is $1, code will be like this.

println(pattern.matcher("2222").replaceAll("$1"))

and printed output will be 2

I hope you enjoyed this article and if you want to learn more about this topic there are some useful resources.

regular-expressions.info website for many good Tutorial and information
regular-expressions.info/books regex books reviews from Jan Goyvaerts
Regular Expressions: Capturing Groups from The Coding Train channel

Enjoy Programming 😋.

Create a simple bot creator in 33 lines of code

Amr Hesham — Wed, 19 May 2021 09:39:30 +0000

Hi, I am Amr Hesham and I am a software engineer who interested in android development and compiler design, and I love to play some RPG games, but some of those games have designed to make your stay on the game as much as possible, So they give you some repeated and boring tasks to do and it’s maybe every day, for example, collect several items …etc, so I have searched for a bot creator to use it and automate those tasks.

I have found a good one with many features like control mouse, keyboard, screen, check pixel color with some helper statements like if, loop …etc.

But to create your script you need to add a list of command with the GUI that means you can write a script like any programming language and I hated this idea, So after trying this program I got one question how can I design one like this or maybe better than it ?!

I started searching for how to control the mouse, screen, keyboard in Java, and after some research, I got many answers and found an amazing class in java called Robot.

Robot as you can see in Oracle documentation

“This class is used to generate native system input events for test automation, self-running demos, and other applications where control of the …”

and it has many useful methods to do exactly what I want, and in this time I have read some Compiler Design books and created many toy programming languages, and also have a good experience in JavaFX Framework, so I found that it will be amazing if I merged my experience in Compiler Design, JavaFX and Robot Class to create my amazing Bot Creator Project.

I have started to create a scripting programming language with keywords for mouse, keyboard, screen then I added support for statements so I added if, while, repeat statements, after that, I want to make it easy for the user to create a complex bot so I have added support for variables, functions and builtin function, for example, I have added builtin function called pixelColor to get the current mouse position pixel value, after finishing this language, it’s time for JavaFX to start so I have created a simple editor for it with some buttons like run, stop, restart …etc. and this is the result I called it SnapMacro.

After finished this project and using it in online games, I used it also to write a bot for Linkedin to add people or maybe I can use it to accept many people inventions and other things.

This is the story behind SnapMacro, by the way, Snap is the name of my scripting language, but the article is not ended here and the goal is not just telling my story but it to show you how to create a simple bot creator in just 33 lines with the same concept.

yes as you can see it will just 33 lines of code!

We will not create a scripting language or support statements or variables, but we will create a simple bot creator that supports mouse, keyboard commands.

So first what we want from our small bot creator? basically, we will support 3 types of commands and the result will be 7 commands.

Mouse Commands

mouse move x y
mouse press right | left
mouse release right | left
mouse wheel x

Keyboard Commands

keyboard press x
keyboard release x

Delay Commands

delay x

So let’s start creating our bot creator, and we will use Kotlin Programming language in this article but you can use Java too or take the concept and use your favourite programming language it doesn’t matter.

First, we will use the Scanner class to read user input from the console and we will initialize an instance of Robot Class and we will user when to check what is the type of current command.

fun main() {
    val scanner = Scanner(System.`in`)
    val robot = Robot()
    while (scanner.hasNext()) {
        when (scanner.next()) {
            "mouse" -> {}
            "keyboard" -> {}
            "delay" -> {}
        }
    }  
}

And now inside every type, we need to support some commands so let us start with the smallest one “delay” is has only one command which is delay x that take time in a millisecond as an integer and use The Robot API to make delay, so the code will be like this.

"delay" -> robot.delay(scanner.nextInt())

Now let’s move to mouse commands and it has 4 commands move, click and wheel, first “press” command and it will take right or left and we will use when to check this, then we have “release” and it exactly like “press” in the structure, then we have “move” command and it takes x and y values and moves the cursor to this position so we need to scan two integers for this command, after that we have “wheel” command and it need just one positive or negative integer.

"mouse" -> when (scanner.next()) {
    "press" -> {
        when (scanner.next()) {
            "right" -> robot.mousePress(BUTTON3_DOWN_MASK)
            "left" -> robot.mousePress(BUTTON1_DOWN_MASK)
        }
    }
    "release" -> {
        when (scanner.next()) {
            "right" -> robot.mouseRelease(BUTTON3_DOWN_MASK)
            "left" -> robot.mouseRelease(BUTTON1_DOWN_MASK)
        }
    }
    "move" -> robot.mouseMove(scanner.nextInt(), scanner.nextInt())
    "wheel" -> robot.mouseWheel(scanner.nextInt())
}

And now we finished the mouse command and we will go for keyboard commands, it has only two commands, “press” and “release” and they take character code, but it will not be very good to force the user to write the keycode like so we will read a character and convert it to a keycode, Robot has a good function that will do this job for use it called getExtendedKeyCodeForChar it takes char and return keycode as an integer, so the keyboard commands part will be like this.

"keyboard" -> {
    val action = scanner.next()
    val character = scanner.next()
    val key = KeyEvent.getExtendedKeyCodeForChar(character[0].toInt())
    when (action) {
        "press" -> robot.keyPress(key)
        "release" -> robot.keyRelease(key)
    }
}

And now Congratulation, you have a simple bot creator so now you can write a script like that.

mouse point 500 500
mouse press left
delay 500
mouse release left
mouse wheel 100
keyboard press A
delay 500
keyboard release A
delay 500

And it will work fine :D

And this is the full code is about 33 lines of code.

fun main() {
    val scanner = Scanner(System.`in`)
    val robot = Robot()
    while (scanner.hasNext()) {
        when (scanner.next()) {
            "mouse" -> when (scanner.next()) {
                "press" -> {
                    when (scanner.next()) {
                        "right" -> robot.mousePress(BUTTON3_DOWN_MASK)
                        "left" -> robot.mousePress(BUTTON1_DOWN_MASK)
                    }
                }
                "release" -> {
                    when (scanner.next()) {
                        "right" -> robot.mouseRelease(BUTTON3_DOWN_MASK)
                        "left" -> robot.mouseRelease(BUTTON1_DOWN_MASK)
                    }
                }
                "move" -> robot.mouseMove(scanner.nextInt(), scanner.nextInt())
                "wheel" -> robot.mouseWheel(scanner.nextInt())
            }
            "keyboard" -> {
                val action = scanner.next()
                val character = scanner.next()
                val key = KeyEvent.getExtendedKeyCodeForChar(character[0].toInt())
                when (action) {
                    "press" -> robot.keyPress(key)
                    "release" -> robot.keyRelease(key)
                }
            }
            "delay" -> robot.delay(scanner.nextInt())
        }
    }
}

If you are interested in this type of projects you shouldn’t stop here, and try to improve it as must as you can, if you want to convert it to a scripting language I recommend to you Crafting Interpreter book that will teach you how to create a compiler and interpreter, you can also store the commands and support some new commands like restart, exit …etc.

Thanks and Enjoy Coding 😋.