In-place Editing in Eclipse TreeViewer

In an Eclipse RCP application I was working on recently, I had to implement a TreeViewer with in-place editing feature. It was not easy to find all the information required to implement this, so I thought I would explain it here.

First let’s take a simple example, where hierarchical data is displayed in  a tree.
tree_viewer1

When any item in the tree is double clicked, I want to edit the value in-place.

Here is the code to create this tree, without editing support. I will first create a data model using a Map. To simplify the example, I am assuming only one level of hierarchy.

Continue reading “In-place Editing in Eclipse TreeViewer”

Calling Objective-C code from JavaScript in iOS applications

In the last post I described how to Create iOS Application with HTML User Interface . In this post I am going to describe how to access Objective-C code from JavaScript running in the WebView. It is not as easy as it is in Android. There is no direct API in UIWebView to call native code, unlike in Android which provides WebView.addJavascriptInterface function.

However, there is a work-around. We can intercept each URL before it is being loaded in the WebView. So to call the native code, we will have to construct a URL and pass method name and argument as part of the URL. We then set this URL to window.location in the JavaScript and intercept it in our ViewController.
However most examples I have seen (including PhoneGap) create an instance of iframe and set its source to the URL –
Continue reading “Calling Objective-C code from JavaScript in iOS applications”

Creating iOS Application with HTML User Interface

Last year in April, I experimented with iOS development for the first time. I have described details in this post. I wanted to spend more time learning iOS application development then, however could not get around to actually doing that till very recently.

I had written a blog post on creating Android application using HTML user interface back in March last year. I was curious to know how to do the same in an iOS application.  In this post I will describe how to embed web view and set a URL in an iOS app and in the next post I would describe how to access native Objective-C code from JavaScript running in the web view control.

Continue reading “Creating iOS Application with HTML User Interface”

Get/Set local variables of JavaScript function from outside & Dynamic code insertion in JS function

I am working on a JavaScript framework that needs to get list of local function variables and set values of some of them. Unlike Java, JavaScript does not have runtime introspection
support. In Java you can do this using Java Reflection APIs, but I couldn’t think of any way to do this in JavaScript. So I searched on the web and came across two threads of discussions on StackOverflow –

There are some interesting solutions discussed in the above threads. The first one discusses solutions for setting local variable values. The second one interested me because I found the technique useful for injecting code (that will set local variable value) in a function.

Continue reading “Get/Set local variables of JavaScript function from outside & Dynamic code insertion in JS function”

Implementing Eclipse Editor Plugin

I had presented a tutorial on implementing Eclipse Editor plugin a couple of years ago. Recently when I started implementing a new Eclipse editor, I was looking for that presentation, but couldn’t find it easily. I like to use my blog as reference for myself, so I thought I would post my Eclipse editor tutorial here.

For the tutorial, I created a new language called VGL (Vector Graphics Language) and built Eclipse editor plugin for it. The language is not important, and just serves the purpose for explaining how to create an editor. The tutorial starts with defining the language and then incrementally builds features of a typical Eclipse editor. I created separate projects for each step in the tutorial. There are nine Eclipse projects. Download and import project in Eclipse for each step if you want to see how it is built incrementally. The last project contains all the editor features covered in this tutorial.

Continue reading “Implementing Eclipse Editor Plugin”

Maintaining expanded/collapsed state in Eclipse TreeViewer

JFace TreeViewer is a very useful UI control for displaying hierarchical data. It is used extensively in Eclipse, for example in Project/Package/Navigator view, Outline view, Debug Variables view etc. Eclipse .org hosts a nice article on TreeViewer – How to use the JFace Tree Viewer.

To specify data and its hierarchy in the TreeViewer, you implement ITreeContentProvider interface. This interface has methods like getElements, getChildren which you need to override to provide content and structure to the TreeViewer. You would typically return array of your model objects from getElements or getChildren methods. And since it is a tree view, you can expand or collapse the nodes. The model classes for an example in the above article could be Category (book, game etc.), Book and Game. Category can have Books or Games. You might load this information from a database and pass it to the content provider object. To refresh information in the TreeViewer, you would call one of the variants of refresh() function.

Continue reading “Maintaining expanded/collapsed state in Eclipse TreeViewer”

Remote JavaScript debugging with Chrome Developer Tools

I have been using Chrome Developer Tools (CDT) for the past couple of weeks to build a JavaScript debugger. Though you can debug JavaScript in Chrome browser itself, my requirement was such that I needed a debugger that runs outside Chrome and debugs pages running in Chrome. I found that Chrome Developer Tools provides a JavaScript debugger plugin for Eclipse. CDT has exposed Java APIs, if you want to build the debugger yourself. It also has exposed JavaScript APIs for its debugger.

So I first evaluated Eclipse plugin that CDT provides. Before I get to that plugin, here are some useful links about CDT –
Continue reading “Remote JavaScript debugging with Chrome Developer Tools”

Record and Playback Drawing in HTML5 Canvas

A few months back I had created an application that recorded and played back drawings on HTML5 Canvas. For some time now I wanted to refactor the code in that application and create a reusable ‘component’ from it. Which is what I did this week.

Go ahead and try the demo first – Press ‘Record’ key below and then draw some strokes/lines in the box with the mouse (holding down left button). Once you are done, click Stop button. Click ‘Play’ button to play back the drawing you just drew. You can pause and resume too.

Continue reading “Record and Playback Drawing in HTML5 Canvas”

"Access restriction" error in Eclipse plugins

I spent quite a lot of time today trying to debug “Access restriction” error in one of my Eclipse plugins. In the last four years of Eclipse plugin development, I don’t recall ever facing this issue, but today suddenly some of the imports in one of the classes in my Eclipse plugin were flagged off as errors –

Access restriction: The type ISelection is not accessible due to restriction on required library <eclipse-path>\eclipse\plugins\org.eclipse.jface_3.6.1.M20100825-0800.jar

I had seen warnings about ‘restricted access’ for some of the imports earlier, but those were for classes that Eclipse discouraged to use e,g, for internal Eclipse classes. But today I was seeing errors.

The error does not tell much about what could have gone wrong. ISelection is exported from jface plugin and it is a public interface. And I had used this class without any error in other plugins.

Continue reading “"Access restriction" error in Eclipse plugins”

Eclipse SWT GridLayout – Making the widget fill horizontally

I have been stuck with the problem of making UI widgets fill horizontally in a grid layout a few times. The solution is simple, but when I have to create UI using Eclipse SWT after a long gap, I tend to forget how I had made this work earlier, so I decided to blog about this.

I had to create a simple UI with one label and associated text box. I coded it like this –

GridLayout layout = new GridLayout(2, false);
tabContainer.setLayout(layout); //this is the parent composite

Label label1 = new Label(tabContainer, SWT.NONE);
label1.setText("Some Label:");
GridData gd = new GridData();
gd.grabExcessHorizontalSpace = false;
label1.setLayoutData(gd);

Text txtBox1 = new Text(tabContainer, SWT.BORDER);
gd = new GridData();
gd.grabExcessHorizontalSpace = true;
txtBox1.setLayoutData(gd);

Continue reading “Eclipse SWT GridLayout – Making the widget fill horizontally”