Skip to content

Commit

Permalink
redirect to open elements
Browse files Browse the repository at this point in the history
  • Loading branch information
hendrikebbers committed Oct 1, 2023
1 parent 1a4d5cd commit 44dbea0
Show file tree
Hide file tree
Showing 126 changed files with 1,772 additions and 1,647 deletions.
1 change: 1 addition & 0 deletions _posts/2011-07-28-fun-with-gestures.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
---
title: 'Fun with gestures'
redirect_to: https://open-elements.com/posts/2011/07/28/fun-with-gestures/
layout: post
author: hendrik
categories: [General]
Expand Down
1 change: 1 addition & 0 deletions _posts/2011-08-04-preview-multitouch-gestures-in-swing.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
---
title: 'Preview: Multitouch gestures in swing'
redirect_to: https://open-elements.com/posts/2011/08/04/preview-multitouch-gestures-in-swing/
layout: post
author: hendrik
categories: [General]
Expand Down
1 change: 1 addition & 0 deletions _posts/2011-08-16-talk-at-cebit-tv-studio.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
---
title: 'Talk at CeBIT TV studio'
redirect_to: https://open-elements.com/posts/2011/08/16/talk-at-cebit-tv-studio/
layout: post
author: hendrik
categories: [General]
Expand Down
1 change: 1 addition & 0 deletions _posts/2011-08-17-jrating-preview.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
---
title: 'JRating Preview'
redirect_to: https://open-elements.com/posts/2011/08/17/jrating-preview/
layout: post
author: hendrik
categories: [General]
Expand Down
1 change: 1 addition & 0 deletions _posts/2011-09-01-gesture-wrapper-0-1-released.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
---
title: 'Gesture Wrapper 0.1 released'
redirect_to: https://open-elements.com/posts/2011/09/01/gesture-wrapper-0.1-released/
layout: post
author: hendrik
categories: [General]
Expand Down
1 change: 1 addition & 0 deletions _posts/2011-09-12-garagetunes-demo.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
---
title: 'GarageTunes demo'
redirect_to: https://open-elements.com/posts/2011/09/12/garagetunes-demo/
layout: post
author: hendrik
categories: [Swing]
Expand Down
85 changes: 43 additions & 42 deletions _posts/2011-09-14-jgrid-tutorial-1.md
Original file line number Diff line number Diff line change
@@ -1,42 +1,43 @@
---
title: 'JGrid Tutorial #1'
layout: post
author: hendrik
categories: [Swing]
excerpt: 'I created a series of tutorials to get familiar with JGrid. This is the first out of five tutorials.'
featuredImage: java-9
permalink: '2011/09/jgrid-tutorial-1/'
header:
text: JGrid Tutorial #1
image: sample
---
At the moment all JGrid demonstrations are very complex and use a lot of Java2D code, web services an so on. So many people asked me to create some simple demos. For this reason I started some bottom-up tutorials for the JGrid.

Here is the first one:
You can integrate a JGrid in every swing application. Just add it to a container:

{% highlight java %}
JGrid grid = new JGrid();
getContentPane().add(new JScrollPane(grid));
{% endhighlight %}

Normally you want to visualize some data in the grid. All data must wrapped in a ListModel:

{% highlight java %}
DefaultListModel model = new DefaultListModel();
for(int i=0; i < 100; i++) {
model.addElement(new Integer(i));
}
{% endhighlight %}

In a final step you must set the model for the grid:

{% highlight java %}
grid.setModel(model);
{% endhighlight %}

With this few lines of code you can add a JGrid to your code. Because the default renderer of the grid uses a label and renders the `toString()`-result of the data to the grid you will see all Integers in a grid:

![Tutorial1](/assets/posts/guigarage-legacy/Tutorial1.png)

You can download the [source file for the tutorial](/assets/downloads/jgrid/tutorial1.java). To run the program you need the jgrid.jar in your classpath.
---
title: 'JGrid Tutorial #1'
redirect_to: https://open-elements.com/posts/2011/09/14/jgrid-tutorial-1/
layout: post
author: hendrik
categories: [Swing]
excerpt: 'I created a series of tutorials to get familiar with JGrid. This is the first out of five tutorials.'
featuredImage: java-9
permalink: '2011/09/jgrid-tutorial-1/'
header:
text: JGrid Tutorial #1
image: sample
---
At the moment all JGrid demonstrations are very complex and use a lot of Java2D code, web services an so on. So many people asked me to create some simple demos. For this reason I started some bottom-up tutorials for the JGrid.

Here is the first one:
You can integrate a JGrid in every swing application. Just add it to a container:

{% highlight java %}
JGrid grid = new JGrid();
getContentPane().add(new JScrollPane(grid));
{% endhighlight %}

Normally you want to visualize some data in the grid. All data must wrapped in a ListModel:

{% highlight java %}
DefaultListModel model = new DefaultListModel();
for(int i=0; i < 100; i++) {
model.addElement(new Integer(i));
}
{% endhighlight %}

In a final step you must set the model for the grid:

{% highlight java %}
grid.setModel(model);
{% endhighlight %}

With this few lines of code you can add a JGrid to your code. Because the default renderer of the grid uses a label and renders the `toString()`-result of the data to the grid you will see all Integers in a grid:

![Tutorial1](/assets/posts/guigarage-legacy/Tutorial1.png)

You can download the [source file for the tutorial](/assets/downloads/jgrid/tutorial1.java). To run the program you need the jgrid.jar in your classpath.
1 change: 1 addition & 0 deletions _posts/2011-09-15-jgrid-talk.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
---
title: 'JGrid Talk'
redirect_to: https://open-elements.com/posts/2011/09/15/jgrid-talk/
layout: post
author: hendrik
categories: [Swing]
Expand Down
67 changes: 34 additions & 33 deletions _posts/2011-09-16-jgrid-tutorial-2.md
Original file line number Diff line number Diff line change
@@ -1,33 +1,34 @@
---
title: 'JGrid Tutorial #2'
layout: post
author: hendrik
categories: [Swing]
excerpt: 'I created a series of tutorials to get familiar with JGrid. This is the second out of five tutorials.'
featuredImage: java-1
permalink: '2011/09/jgrid-tutorial-2/'
header:
text: JGrid Tutorial #2
image: sample
---
After we created a simple JGrid (see [tutorial #1]({{ site.baseurl }}{% post_url 2011-09-14-jgrid-tutorial-1 %}) we want to modify the look now. The JGrid has a lot of getter/setter to change the visualization of the grid. Read the JavaDoc for a complete overview of all properties.

Here is an example of changing colors and dimensions:

{% highlight Java %}
grid.setFont(grid.getFont().deriveFont(40.0f));
grid.setFixedCellDimension(56);
grid.setHorizonztalMargin(4);
grid.setVerticalMargin(4);
grid.setHorizontalAlignment(SwingConstants.LEFT);
grid.setBackground(Color.WHITE);
grid.setSelectionBorderColor(Color.BLUE);
grid.setSelectionBackground(Color.CYAN);
grid.setCellBackground(Color.LIGHT_GRAY);
{% endhighlight %}

After setting all properties the grid looks like this:

![Tutorial2](/assets/posts/guigarage-legacy/Tutorial2.png)

You can download the sources for the tutorial [here](/assets/downloads/jgrid/tutorial2.java).
---
title: 'JGrid Tutorial #2'
redirect_to: https://open-elements.com/posts/2011/09/16/jgrid-tutorial-2/
layout: post
author: hendrik
categories: [Swing]
excerpt: 'I created a series of tutorials to get familiar with JGrid. This is the second out of five tutorials.'
featuredImage: java-1
permalink: '2011/09/jgrid-tutorial-2/'
header:
text: JGrid Tutorial #2
image: sample
---
After we created a simple JGrid (see [tutorial #1]({{ site.baseurl }}{% post_url 2011-09-14-jgrid-tutorial-1 %}) we want to modify the look now. The JGrid has a lot of getter/setter to change the visualization of the grid. Read the JavaDoc for a complete overview of all properties.

Here is an example of changing colors and dimensions:

{% highlight Java %}
grid.setFont(grid.getFont().deriveFont(40.0f));
grid.setFixedCellDimension(56);
grid.setHorizonztalMargin(4);
grid.setVerticalMargin(4);
grid.setHorizontalAlignment(SwingConstants.LEFT);
grid.setBackground(Color.WHITE);
grid.setSelectionBorderColor(Color.BLUE);
grid.setSelectionBackground(Color.CYAN);
grid.setCellBackground(Color.LIGHT_GRAY);
{% endhighlight %}

After setting all properties the grid looks like this:

![Tutorial2](/assets/posts/guigarage-legacy/Tutorial2.png)

You can download the sources for the tutorial [here](/assets/downloads/jgrid/tutorial2.java).
119 changes: 60 additions & 59 deletions _posts/2011-09-17-jgrid-tutorial-3.md
Original file line number Diff line number Diff line change
@@ -1,59 +1,60 @@
---
title: 'JGrid Tutorial #3'
layout: post
author: hendrik
categories: [Swing]
excerpt: 'I created a series of tutorials to get familiar with JGrid. This is the third out of five tutorials.'
featuredImage: java-1
permalink: '2011/09/jgrid-tutorial-3/'
header:
text: JGrid Tutorial #3
image: sample
---
In this tutorial I will show you how to visualize more complex data with renderers. First we have to create a data model. For this tutorial we will work with the `java.awt.Color` class and create a ListModel with some colors in it:

{% highlight Java %}
DefaultListModel model = new DefaultListModel();
Random random = new Random();
for(int i=0; i <= 100; i++) {
model.addElement(new Color(random.nextInt(256), random.nextInt(256), random.nextInt(256)));
}
grid.setModel(model);
{% endhighlight %}

After assigning this model to the JGrid the result will look like this:

![Tutorial3](/assets/posts/guigarage-legacy/Tutorial3-1.png)

The JGrid uses a default renderer to visualize data. This renderer based on a JLabel and displays the toString() results from the given data. Therefore you see these "java.awt.Color..." strings in the grid cells.

To visualize the colors inside the grid we need a new renderer. All renderers for the JGrid must implement the interface GridCellRenderer. Here is the code for a simple renderer for colors:

{% highlight Java %}
public class GridColorCellRenderer extends JPanel implements GridCellRenderer {

private static final long serialVersionUID = 1L;

@Override
public Component getGridCellRendererComponent(JGrid grid, Object value, int index, boolean isSelected, boolean cellHasFocus) {
if(value != null && value instanceof Color) {
this.setBackground((Color) value);
}
return this;
}
}
{% endhighlight %}

Now we have to assign the renderer to the JGrid. Here is a different to the default JList or JTable behavior. The renderer for JGrid are stored in a special handler. You can refer to this handler by `grid.getCellRendererManager()` / `grid.setCellRendererManager()`. By using this handlers you can manage the same renderers for different grids (On a later JGrid release I will add SPI support to the handlers).

To add the custom renderer to your grid you have to add it to the handler:

{% highlight Java %}
grid.getCellRendererManager().setDefaultRenderer(new GridColorCellRenderer());
{% endhighlight %}

Now our application shows the right colors inside the grid cells:

![Tutorial3](/assets/posts/guigarage-legacy/Tutorial3-2.png)

You can download the source file for this tutorial [here](/assets/downloads/jgrid/tutorial3.java).
---
title: 'JGrid Tutorial #3'
redirect_to: https://open-elements.com/posts/2011/09/17/jgrid-tutorial-3/
layout: post
author: hendrik
categories: [Swing]
excerpt: 'I created a series of tutorials to get familiar with JGrid. This is the third out of five tutorials.'
featuredImage: java-1
permalink: '2011/09/jgrid-tutorial-3/'
header:
text: JGrid Tutorial #3
image: sample
---
In this tutorial I will show you how to visualize more complex data with renderers. First we have to create a data model. For this tutorial we will work with the `java.awt.Color` class and create a ListModel with some colors in it:

{% highlight Java %}
DefaultListModel model = new DefaultListModel();
Random random = new Random();
for(int i=0; i <= 100; i++) {
model.addElement(new Color(random.nextInt(256), random.nextInt(256), random.nextInt(256)));
}
grid.setModel(model);
{% endhighlight %}

After assigning this model to the JGrid the result will look like this:

![Tutorial3](/assets/posts/guigarage-legacy/Tutorial3-1.png)

The JGrid uses a default renderer to visualize data. This renderer based on a JLabel and displays the toString() results from the given data. Therefore you see these "java.awt.Color..." strings in the grid cells.

To visualize the colors inside the grid we need a new renderer. All renderers for the JGrid must implement the interface GridCellRenderer. Here is the code for a simple renderer for colors:

{% highlight Java %}
public class GridColorCellRenderer extends JPanel implements GridCellRenderer {

private static final long serialVersionUID = 1L;

@Override
public Component getGridCellRendererComponent(JGrid grid, Object value, int index, boolean isSelected, boolean cellHasFocus) {
if(value != null && value instanceof Color) {
this.setBackground((Color) value);
}
return this;
}
}
{% endhighlight %}

Now we have to assign the renderer to the JGrid. Here is a different to the default JList or JTable behavior. The renderer for JGrid are stored in a special handler. You can refer to this handler by `grid.getCellRendererManager()` / `grid.setCellRendererManager()`. By using this handlers you can manage the same renderers for different grids (On a later JGrid release I will add SPI support to the handlers).

To add the custom renderer to your grid you have to add it to the handler:

{% highlight Java %}
grid.getCellRendererManager().setDefaultRenderer(new GridColorCellRenderer());
{% endhighlight %}

Now our application shows the right colors inside the grid cells:

![Tutorial3](/assets/posts/guigarage-legacy/Tutorial3-2.png)

You can download the source file for this tutorial [here](/assets/downloads/jgrid/tutorial3.java).
75 changes: 38 additions & 37 deletions _posts/2011-09-18-jgrid-tutorial-4.md
Original file line number Diff line number Diff line change
@@ -1,37 +1,38 @@
---
title: 'JGrid Tutorial #4'
layout: post
author: hendrik
categories: [Swing]
excerpt: 'I created a series of tutorials to get familiar with JGrid. This is the fourth out of five tutorials.'
featuredImage: java-2
permalink: '2011/09/jgrid-tutorial-4/'
header:
text: JGrid Tutorial #4
image: sample
---
In this tutorial we want to add zoom functionality to the JGrid. You can set the dimension of the grid cells be the property `fixedCellDimension`. Here is a example for two different dimensions:

![tutorial4-1](/assets/posts/guigarage-legacy/tutorial4-1.png)

![tutorial4-2](/assets/posts/guigarage-legacy/tutorial4-2.png)

To add a zoom functionality to the grid you can set the dimension by using a JSlider. Here is the code:

{% highlight Java %}
final JSlider slider = new JSlider(32, 256);
slider.setValue(grid.getFixedCellDimension());

slider.addChangeListener(new ChangeListener() {
@Override
public void stateChanged(ChangeEvent arg0) {
grid.setFixedCellDimension(slider.getValue());
}
});
{% endhighlight %}

Now you can edit the dimension dynamically. Here is the result:

{% include posts/youtube.html id="Zyqf-P2ftFs" %}

You can download the source file [here](/assets/downloads/jgrid/tutorial4.java).
---
title: 'JGrid Tutorial #4'
redirect_to: https://open-elements.com/posts/2011/09/18/jgrid-tutorial-4/
layout: post
author: hendrik
categories: [Swing]
excerpt: 'I created a series of tutorials to get familiar with JGrid. This is the fourth out of five tutorials.'
featuredImage: java-2
permalink: '2011/09/jgrid-tutorial-4/'
header:
text: JGrid Tutorial #4
image: sample
---
In this tutorial we want to add zoom functionality to the JGrid. You can set the dimension of the grid cells be the property `fixedCellDimension`. Here is a example for two different dimensions:

![tutorial4-1](/assets/posts/guigarage-legacy/tutorial4-1.png)

![tutorial4-2](/assets/posts/guigarage-legacy/tutorial4-2.png)

To add a zoom functionality to the grid you can set the dimension by using a JSlider. Here is the code:

{% highlight Java %}
final JSlider slider = new JSlider(32, 256);
slider.setValue(grid.getFixedCellDimension());

slider.addChangeListener(new ChangeListener() {
@Override
public void stateChanged(ChangeEvent arg0) {
grid.setFixedCellDimension(slider.getValue());
}
});
{% endhighlight %}

Now you can edit the dimension dynamically. Here is the result:

{% include posts/youtube.html id="Zyqf-P2ftFs" %}

You can download the source file [here](/assets/downloads/jgrid/tutorial4.java).
Loading

0 comments on commit 44dbea0

Please sign in to comment.