Didn't know quite how to title this question, so suggested edits are welcome.
Right now, I have a fairly simple pair of JComboBoxes for searching row & column headers in a heatmap display. It's been augmented with the ability to allow wildcards. Here's what it looks like:
It works well enough, but a new requirement for the next version is to consolidate the pair of search boxes into 1 search box plus a few other enhancements. Basically, what we'd like to do is enter a search term and have the resulting dropdown have 2 sections: 1 for options and another for the matching results. The desired options would be things like this:
Search rows/columns checkboxes
song/artist/genre checkboxes (to use the iTunes analogy) or google/bing (to use the browser analogy)
Search within previous search results: like have a previous search term with an 'x' next to it to clear it. It would act like a filter.
The thing about this is, the desire to consolidate 2 search boxes to 1 is to simplify the interface, but at the same time, we want this additional functionality.
A JComboBox doesn't seem to be able to handle something like this, and my search for alternatives isn't yielding anything. I know this question is somewhat of a broad design question, perhaps not appropriate for stack exchange. I'm still fairly new to Java, so any suggestions are appreciated.
UPDATE: One of the commenters asked for something more specific and pointed out the existence of different types of iTunes searches based on context, which I'd like to disambiguate. Taking a look at how iTunes does it, I decided to try to mock up a graphic of what I was thinking I could do:
So given this specific example, I envision separating the combo box and the search options, perhaps with a JMenu revealed using a button made to look like iTunes' search options feature.
So my evolved questions are (based on the above mock-up):
Can JMenu do this or is there another type of button-initiated menu I should use?
Can menu selections trigger a re-population of the list the JComboBox provides or would that have bad side-effects?
How can I alleviate the confusion of having a drop-down on either side of the search field?
I don't know what is the name of this visualization type, but I want to learn how to draw trees like the ones in this image:
I've seen this kind of visualization in many sites but I'm unable to know the technical term behind it.
That graph seems a lot like a force-directed layout. Painting those kind of images is not an easy task, depending on what are you trying to accomplish, you might want to use an existing framwork. If you want to use java you should see at gephi, if you can use an html approach you should definitely take a look at d3.js which is a javascript library for data visualization. They have neat examples: directed-force layout, and collapsible-force layout.
This particular image is done by Stephanie Posavec. You can learn about her design process from an interview she gave the folks at the Data Stories podcast. As far as I remember it, she partially crafts her visualizations by hand, so I'm not sure if you'll ever find an algorithm that does exactly this for you. For different tree layout algorithms, you can refer to treevis.net.
I'm adding in some functionality to a MIDP-based app which requires me to track whether or not an Item has focus. I'm only really concerned with field-style Items and need to determine when the user has finished inputting data into the Item.
I'm aware that CustomItem has the traverse() callback, but I can't find anything similar for classes like DateField, TextField and ChoiceGroup.
I'm also aware of Display.setCurrentItem() but for some strange reason there doesn't seem to be a Display.getCurrentItem() method.
Implementing all the controls as CustomItems isn't really an option as it's a pre-existing app and there are quite a lot of controls to deal with. I can't believe that nobody has run into this issue before, but I've searched on here and google to no avail. Hopefully I'm just missing something obvious in the API, but if there isn't a definite answer then creative solutions are welcome!
In MIDP 2 lcdui API, the only field-style Items are, well, interactive subclasses of Item: TextField, DateField, Gauge.
For above items the closest match to what you are asking about seem to be provided by ItemStateListener (take a look at API javadocs here if you're interested).
...used by applications which need to receive events that indicate changes in the internal state of the interactive items...For implementations that have the concept of an input focus, the listener should be called no later than when the focus moves away from an item whose state has been changed.
If you plan to use this API, carefully check the docs to verify that it indeed gives you what you want - there are some subtle limitations there. If it turns out that you need greater control than that, your options are either to use low level UI (Canvas, events) or 3rd party library like LWUIT, J2ME Polish...
to start with I've gone through the entire notepad tutorial, I'm a professional game programmer who has some extra time. (though most of my time has been in C++, I did take a year or two of Java classes in college, and remember some of it).
I'm not sure the site is a good site to ask questions like this.. If someone has a Forum that might be a good place to ask these newbie questions, please feel free to point me in the direction.
I've examined a few of the samples, and think I've a grasp of what I want to do. I've a three to four project plan for some Android releases to sharpen my skills, but since this is my first project and I have never really developed for a mobile phone or the android before, I'd like to make sure I have a solid plan.
The first project is an example of the license plate game, however I want to do a few things to change it. Heck maybe when I'm done it'll become a bingo style game, with bluetooth connectivity, you never know.
The base idea is I want to offer a list of states, with checkboxes next to them. so to do this, I'll be starting with a Linear List layout similar to the note pad example, and then have a row that is only a Checkbox. I can use text and call strike through if it's been checked off. Perhaps offer an option to not show them if they are checked.
But I want the list to be generated from a set of lists. Maybe all of America's states, maybe reasonable American states (no Hawaii, no Alaska) maybe a North American list, (add in Mexico and some Canadian provinces), a European list, who knows.
I'd probably have to have a pop up window that lists all of the lists I suppose using a radiogroup of some sort.
So then as far as the data, after weighing options I think best solution is to make a database with two fields, "checked" and "name".
I figure I can use the menu for most of the user interaction (aside from clicking on stuff we want to check off) with maybe a few context menu items, I understand how to make all of those already so I should be good.
The question I have is what is the best way to populate the lists? Should I create raw data, and have different files for all the lists? Or is there some other way to do this? I've seen this done on the searchable dictionary, but I'd like to hear what people who have actually generated the data like this before.
In addition is there an easy way to look at the sql database these applications create, or do you have to run searches on them and output the data?
Finally any other suggestion or advice? I definitely want to try to get something like this on the market so I can see the full life cycle and see if anyone actually likes it. (luckily there's not a plethora of them already) but I also want a few people to look over my code if they're willing when I'm done to make sure I've done this right or at least not missing any basic mistakes.
Thank you for your time,
Frank
As far as check boxes, you can design your list item layout to have a checkbox in it. You should make some sort of object that will hold all of the data for each list item, including the status of their checkbox (something like isChecked). Instead of storing a list of String objects containing the names of states, you should have a list of State objects. then, say you wanted to take some action on every checked item, you can easily iterate through the list you gave to the ListAdapter and see which ones are selected.
Was this helpful?
You can stick to C++ if thats your thing (there are some limitations, there are some benefits) , please read this primer for details.
For data folks are going to steer you towards SQLite since is available OOTB with Android.
I am an undergraduate student. I was exposed to basic programming couple of years back in school. Till now I have an understanding of Core Java, Core Python and basic C and C++.
Every time I start off with some GUI programming so as I can start off with a project of mine, I get boggled by the sheer amount which is to be done, API to be learnt, MVC architecture and everything programmers talk about, event handling etc etc.
Studied awt and swings for a while. Tried my hands on Qt and Gtk, could not find much of documentation. Tried to make sense of pygame. I end up at the same place, knowing the core language.
Tkinter on my zenwalk Linux is broken so could never start it athough I own a book on python with Tkinter explained.
But I end up at the same place, with just the basic understanding of the language.
Want to start over, seriously now. I would like to choose python. How should I go about studying GUI programming?
I need some Internet resources and direction so that I don't end up at the same place!
Since it sounds like you want Python GUI programming, may I suggest PyGTK?
That's probably a pretty good place to start for someone who knows Python and would like to start small on some basic GUI apps. GTK can be complex at times, but with PyGTK there's plenty of open-source example apps you can study, from simple to complex.
Edit: This tutorial from LinuxJournal seems pretty helpful.
Edit 2: Here's the tutorial from PyGTK's site, and another tutorial I randomly found from Google (seems like that whole blog is pretty useful for what you want to do, actually). Finally, the snippet at the bottom of this page might be helpful, courtesy of Ubuntu's forums.
If you are leaning more to games...
I suggest you install Pygame and Python, and go through their tutorials. The pick a simple game or graphics project and program it!
For Python GUIs I like wxPython (www.wxpython.org). It is pretty easy to get started with simple controls and layouts. It is also cross platform. Plenty of tutorials out there. Just search for wxPython tutorial.
I know how you feel--I learned a whole lot of computer programming during my CS degree but very little about GUIs. I ended up teaching myself Cocoa/Objective-C for a project. Cocoa is wonderful for GUI stuff but often a royal pain with a steep learning curve. If you don't have any experience with C programming, don't bother.
First step: familiarize yourself with the MVC (Model/View/Controller) design convention, because nearly every GUI framework will reference it. Google it--there are lots of resources about it. My quick, simple definition is:
The model level defines the data or the logical model for the application. For a web app, that would be the database. For a game, it could be stored data and game logic/rules.
The view level is what the user sees and interacts with (the GUI).
The controller level is the logic that connects the two. For example, the controller knows that when you click the "start game" button in the view level, it does some stuff with the model (say, setting up the board and the players.)
Step two: Figure out what you want. Are you interested in desktop applications specifically? Games? Web apps?
If mostly what you want to do is to be able to develop something that people would actually use, another option is to learn a web development framework. The frameworks make stuff easy for you. I love Django, personally, and if you know a little Python and a little HTML and a little about MVC, you can pick it up quickly. (Just don't be confused, because what Django calls a view is actually a controller.)
If what you want to do is games or graphics/animation stuff, check out pygame. I used it for a class project--basically taught it to myself in a couple of weeks--and it worked great.
I'd say stay as far away as you can from Java Swing/awt/etc.
I've heard good things about wxPython--I almost ended up using it instead of Cocoa, because the wx stuff is available in several programming languages and it's all cross platform.
Good luck! Stay strong! I know it's really intimidating, because I've been in your shoes. You can do it with some work, practice, and motivation.
Many have recommended wxPython, and I second their enthusiasm - it is a great framework; it also includes a serious demo (with code and live applications) which will be extremely valuable for learning.
Now, BEWARE!
It is very simple to confuse the end with the means. Programming GUIs can be extremely attractive but not very productive. In my early days I spent days and days trying to get a simple plotting application (reinventing the wheel); a simple GUI for solving quadratic equations; a simple GUI for calling database queries by clicking on certain locations on a map, etc. During all this time I never actually dug into algorithms or more general and productive computer science and computer engineering topics. In retrospect, I should have. Granted, I did learn a lot and I don't totally regret it, but my advice stands: worry about your algorithm first and about your interface second. This may not apply to every field (I am an engineer for NASA). Nowadays I work with number crunching applications with no GUIs whatsoever; I don't think they need them!
Anyway, I just wanted to share my two cents with GUI programming - have fun but don't overdo it.
What do you mean by "Graphics"? Do you mean game graphics, or do you simply mean user interface code (forms, webpages, that sort of thing)? In the case of game graphics, there's a limit to how simple things can be made, but http://www.gamedev.net, for example, has tons of introductory articles on 2d and 3d engines. For something more along the application line, you might simply download Visual Studio or Eclipse and spend some time looking at the code that is autogenerated by their WYSIWYG editors.
For GUI work in general:
Less is more
GUI work (even in productive frameworks) is about as fun and productive as painting the Eiffel Tower with a toothbrush. Go for a minimal design.
Avoid State Like The Plague
Do you put state in your GUI, or in the model? If you put it in the GUI, you are going to mess yourself up with redundant and inconsistent code paths. If you put it in the model, you risk an overly complex system that gets out of sync when your GUI fails to update from the model. Both suck.
wxPython
If you want to learn wxPython, here are a few traps I noticed:
The tutorial
Use this tutorial - http://wiki.wxpython.org/AnotherTutorial
It's the best one I found.
But remember to toggle line numbers, for easy pasting.
Events
Events are a bit like exceptions, and they are used to make things interactive.
In a vanilla python program, you write something like:
def doit(i):
print 'Doing i = ',i
for i in range(10):
doit()
print 'Results = ',result
In a GUI, you do something like:
def doit(event):
print 'An event',event,'just happened!'
event.Skip()
import wx
app = wx.App()
frame = wx.Frame(None, -1, 'The title goes here')
frame.Bind(wx.EVT_KEY_DOWN, doit)
frame.Show()
app.MainLoop()
Every time the user presses a key down, an event will be raised. Since frame is bound to the event (frame.Bind(wx.EVT_KEY_DOWN, doit)), the function doit will be called with the event as an argument.
Printing to stderr isn't too hot in a gui, but doit could also call up a dialog, or do anything you want it to.
Also, you can generate your own events using timers.
Apps, Frames, Windows, Panels, and Sizers
Everything has a parent. If an event is raised, and the child doesn't skip it (using event.Skip()), then the parent will also have to handle the event. This is analogous to exceptions raising up to higher-level functions.
A wx.App is like the Main function.
wx.Window isn't really used. Stuff inherits from it, and it has all the methods for sizing and layout, but you don't need to know that.
wx.Frame is a floating frame, like the main window in Firefox. You will have main one frame in a basic application. If you want to edit multiple files then you might have more. A wx.Frame won't usually have parents.
wx.Panel is part of a parent window. You can have several panels inside a frame. A panel can have a wx.Frame as a parent, or it might be the child of another panel.
wx.Sizers are used to automatically layout panels inside frames (or other panels).
Code:
def doit1(event):
print 'event 1 happened'
def doit2(event):
print 'event 2 happened'
import wx
app = wx.App()
frame = wx.Frame(None, -1, 'The title goes here')
panel_1 = wx.Panel(frame,-1,style=wx.SIMPLE_BORDER)
panel_2 = wx.Panel(frame,-1,style=wx.SIMPLE_BORDER)
panel_1.Bind(wx.EVT_KEY_DOWN, doit1)
panel_2.Bind(wx.EVT_KEY_DOWN, doit2)
panel_1.SetBackgroundColour(wx.BLACK)
panel_2.SetBackgroundColour(wx.RED)
box = wx.BoxSizer(wx.HORIZONTAL)
box.Add(panel_1,1,wx.EXPAND)
box.Add(panel_2,1,wx.EXPAND)
frame.SetSizer(box)
frame.Show()
app.MainLoop()
I've been really bad, and not used OOP practices. Just remember that even if you hate OO in most contexts, GUI programming is the place where OOP really shines.
The MCV
I don't get MCV. I don' think you need an MCV. I think a MW (model-widget) framework is fine.
For example - 2 frames that edit the same piece of text:
class Model(object):
def __init__(self):
self.value = 'Enter a value'
self.listeners = []
def Add_listener(self,listener):
self.listeners.append(listener)
def Set(self,new_value):
self.value = new_value
for listener in self.listeners:
listener.Update(self.value)
import wx
app = wx.App()
class CVFrame(wx.Frame):
def __init__(self, parent, id, title, model):
wx.Frame.__init__(self, parent, id, title, size = (100,100))
self.button = wx.Button(self, -1, 'Set model value')
self.textctrl = wx.TextCtrl(self, -1,model.value)
self.button.Bind(wx.EVT_BUTTON,self.OnSet)
self.model = model
model.Add_listener(self)
sizer = wx.BoxSizer(wx.VERTICAL)
sizer.Add(self.button,0,wx.EXPAND)
sizer.Add(self.textctrl,1,wx.EXPAND)
self.SetSize((300,100))
self.SetSizer(sizer)
self.Center()
self.Show()
def OnSet(self,event):
self.model.Set(self.textctrl.GetValue())
def Update(self,value):
self.textctrl.SetValue(value)
model = Model()
frame1 = CVFrame(None, -1, 'Frame 1',model)
frame2 = CVFrame(None, -1, 'Frame 2',model)
app.MainLoop()
wxPython has a listener-subscriber framework, which is a better version of the model I just sketched out (it uses weak refs, so deleted listeners don't hang around, and so on), but that should help you get the idea.
If you have already gone through pygame, tk, Qt, and GTK, then really the only thing left that I can think of is pyglet, which I admit I have not tried, but I have read uniformly good things about it.
Still, more than anything it sounds as though you have trouble sticking with a framework long enough to really grok it. May I recommend starting with a small project, such as Pong or Breakout, and only learning as much as you need to make it? Once you have finished one thing, you will have a feel for the library, and continuing past there is a lot easier.
whatever language you choose you will have to deal with the many details involving GUI programing. this is due to the nature of the window based environment usually used for GUI.
what can help you move forward quickly in developing GUI based application is less the language and more the IDE you use. a good IDE can do some part of the less interesting stuff for you letting you focus on the big picture.
with C# in VS 2008 its all about choosing elements and methods from lists boxes. its very easy to get started and have a working project.
you can then try to customize your application to gain better understanding of whats going on behind the scenes
One of the greatest Python GUI you can study from is the source of IDLE. It always comes with Python.
For Java, you could also look into SWT.
While I have never used AWT or Swing, I have read that SWT is the easiest of the three to learn.
Here is a decent comparison between the three.