|
Hello.
Part of the interface that I'm developing requires that there be some sort of interactive periodic table of the elements. I'm not completely sure how I should go about doing this and I was wondering if anyone here had any good ideas for me, or knew where I could find some info on it. I need it to look like the traditional periodic table, but the user is able to click on any number of the elements, and the element number for the ones they select will end up in a list. The only thing I could think of doing was creating one button for each of the elements (which is a lot of buttons!!) and each time a button is clicked, the element number is either added or removed from the list. Anyone have any better ideas they'd like to share with me?
Thanks a lot.
|
|
|
|
|
You could make it so that by dbl-clicking anywhere within that element's cell causes the element to be added to the list. If part of your element class contains info about it's screen coordinates and you create a BOOL ClickInBounds(POINT) member, then you could handle the WM_LBUTTONDBLCLICK by calling each elements ClickInBounds() with the double-click coordinates and it return TRUE if the dbl click was within it's cell.
|
|
|
|
|
Would I end up having to make a table to put all the elements in (I'm not sure how to do this using VC++ 6), or by "element's cell" do you mean just a bunch of static text boxes? (I've noticed that through the class wizard static text boxes only have the option of being single-clicked, which is fine)
I haven't been using VC++ for too long, so I'm still learning all this stuff.
|
|
|
|
|
You should create a PeriodicTable class first and one of its data members would be an array of Element objects. I would attack it by creating an Element class and making sure it had a data member for its row and column in the periodic table.
You would also need a data member for what type of element it was so you could use that type to determine the background color for that element and the font colors.
To draw each cell, you could take the width in pixels of the current window and divide 18 (number of columns). That would act as the height and width of each element's cell. Call this variable
cellwidth.
To determine where to draw each cell, you could take its column, multiply by cellwidth and that number would be the left extent of it's rectangle. Multiplying its row by cellwidth would give you the top boundry of its rectangle. The right and bottom of the rectangle could be determined by adding cellwidth to the left and top values. This will enable you to handle the window resize message and adjust the values in the PeriodicTable class so that your entire table will automatically resize when the window resizes.
Most of that functionality should be stuck in the PeriodicTable class's DrawTable method.
Draw table would call each Element in the arrays DrawElement method.
You do not need to use controls in the resource editor to do any of this. Just use GDI calls to draw the rectangles in the Element::DrawElement() method.
|
|
|
|
|
Arranging such a huge lot of buttons in your dialog seems clumsy to me (plus you'll get close to some limit in the number of controls a resource template can hold --something like 256, if I remember well.)
Maybe you can try laying out your periodic table using some grid control, like for instance Chris Maunder's astonishing MFC Grid control 2.24[^]. The idea is to define one grid control only and fill its cells in OnInitDialog, possibly with information from a config file for maximum fexibility. Some of the cells would be, so to say, void (those outside the table shape) and the others will hold the elements and additional labels (like the group, period, lanthanoids, etc.)
The cells have an overridable OnClick method that you can then use to trigger the appropriate action when the user clicks on an element.
Hope this helps, good luck.
Joaquín M López Muñoz
Telefónica, Investigación y Desarrollo
|
|
|
|
|
seems like a fun project . My initial reaction to this was to use something like a grid control . I have had the experience of doing a lot of weird things with grid controls. My experience with Datadynamics #grid control has been good as they have a wide variety of props and methods ! Chris Maunder has a free ctrl . you can have a list corresponding to a cell and set the properties (name , atomic no , atomic weight , blank if some reserved range or pop ups for the lanthanide and actinide series ) . also tool tips that display the same . plus u could add different shading colors to metals , metaloids non metals and inert elements !
|
|
|
|
|
Make a blank template bmp of the elements table.
Fill each box with a unique color and save it.
Create an array of elements and their unique color.
Then make a real bitmap of the elements table using your template and save it.
Show the real bitmap on the window and capture each mouse click's location (point). Take the coordinates of the click on the real bitmap and get the unique color at that location on the saved template bitmap.
Find the color in your elements array and that's the element you clicked on.
"It is better to remain silent and be thought a fool than to open one's mouth and remove all doubt." - Abraham Lincoln
|
|
|
|
|
Give me a few hours - I'll bet I can come up with a more convoluted way of doing this! 
|
|
|
|
|
I don't think its convoluted at all. In fact, I think my way is much easier than your suggestion. The unique color value would be an index into the table of elements. She wouldn't have to draw anything but one bitmap, and she would only need an element class and to read in the color values of the template bitmap beforehand.
She could do a stretchblt to make both bitmpas fit the window size.
"It is better to remain silent and be thought a fool than to open one's mouth and remove all doubt." - Abraham Lincoln
|
|
|
|
|
But what about window resizing?
When all you need to do is draw a rectangle with text, then I tend to use GDI to draw a rectangle and text.
Although there is a certain elegance when you get down to determining which element was clicked on, the building the infrastructure for such elegance is worse than using a slightly less tricky technique.
|
|
|
|
|
Terry O`Nolley wrote:
But what about window resizing?
Use StretchBlt to resize both the on screen table graphic and the off screen template graphic, assuring that they remain the same size.
Most Element tables aren't arranged in a square grid pattern. The look more like this: http://www.webelements.com/[^]
It's easy to draw X elements with i rows and j columns, but its not so so easy to draw 2 on one row, 4 on another, etc.
Terry O`Nolley wrote:
Although there is a certain elegance when you get down to determining which element was clicked on, the building the infrastructure for such elegance is worse than using a slightly less tricky technique.
You have one offscreen DC containing the template bitmap. If the screen and template are the same size, all you have to do is call dcOffScreen.GetPixel(x,y) to get the color at the point clicked. If it's black, then they didn't click on an element. If its not black, find the element with that color and there you have it. The hardest part would be reading the colors into your element object, but that could be hard coded if need be.
"It is better to remain silent and be thought a fool than to open one's mouth and remove all doubt." - Abraham Lincoln
|
|
|
|
|
THe more you describe it, the more I like it.........
I think I just have an aversion to using large bitmaps when not necessary.
Another drawback to using bitmaps is that if you need to change any text, or add functionality you have to redo the bitmaps.
I am actually writing this app with an eye on the entire design process for a beginners article.
I'm using an Access database to hold the info about the elements and GDI to do the display graphics. WHen I find new info about an element, say the discoverer, I can just update it and not have to worry about creating a new bitmap and doing all of that color mapping.
|
|
|
|
|
Terry O`Nolley wrote:
I think I just have an aversion to using large bitmaps when not necessary.
I don't know how to make bitmaps anyway. Although, if everyone here feels this is the best way for me to do it, I guess there's no harm in learning! I want to impress my boss (he already loves everything I've done so far!), so all this help you're all giving me is great!
|
|
|
|
|
I wrote up a quick and dirty demo of this conscept. I'll send it to you if you're interested. I think I'll write an article on it too.
"It is better to remain silent and be thought a fool than to open one's mouth and remove all doubt." - Abraham Lincoln
|
|
|
|
|
Yes, I'm definitely interested in seeing how you did it. I still don't completely know how I want to go about doing this, so it would be nice to have something to look at.
Thanks so much.
|
|
|
|
|
Want me to send this to you via email?
"It is better to remain silent and be thought a fool than to open one's mouth and remove all doubt." - Abraham Lincoln
|
|
|
|
|
Yeah, can you send it through this, or do i have to give you my email address? (I don't mind if i have to, it's not that big of a deal really)
|
|
|
|
|
|
Ok, i saw the ? thing used in some code, and i dont know what it does. I tried googling, but, um, i dont know what its called, and you cant google for "c++ ?" very easily.
So, what is it called so i can google for it lol.
*.*
cin >> knowledge;
|
|
|
|
|
You mean like: int foo = (blah == 2) ? 1 : 0; or something like that? If so, that's a conditional expression, referred to variously as "immediate if", the "ternary operator", the "conditional operator", or simply the "?:" operator. It's basically an "if..then..else" type of expression that returns a value. Users of functional languages are very familiar with doing conditionals like this.
- Mike
|
|
|
|
|
|
ok, so in the example above, it basically means
<br />
(if blah == 2)<br />
{<br />
foo = 1;<br />
}<br />
else<br />
{<br />
foo = 0;<br />
}<br />
<br />
pretty neat...thanks-o.
*.*
cin >> knowledge;
|
|
|
|
|
|
do you mean the ? : operator????
This is just an abbreviation for an if else statement used in C++. Consider the following for example:
return x = a ? b< c : d > a;
In this case x is either (b<c) or="" (d="">a) depending on the programming return value.
Hope it helps.
Regards.
Alex
|
|
|
|
|
I was able to redistribute MSXML4 using a msi package. everything worked ok till i was working as administrator on a Windows 2000 box , when I logged on as a user I got an error in the XML part of the code saying that the object couldnt be created ! What do i need to do ?
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
