Irregular polygon, using OS API

[ken_anthony]

I can do almost everything I need with one graphic call that PureBasic doesn't seem to have...

polygon (color, shape, XY, booleanFilled)

This call would draw an irregular polygon in a particular RGB value at a particular XY location either in outline or filled using a win32 API call. I'm using Linux but presume it has something similar in GTK.

Note that this is not the same as drawing connected line segments then flooding it with color. For one thing, using the API, if your line segments cross themselves on a filled polygon some areas will become transparent polygons within the main polygon.

I'm sure PureBasic has the power to give me back my polygon function and I'll do that if I have to, but I'm hoping somebody else has already had the need and figured it out.

BTW, sprites aren't going to work for me here even though a rotate function exists. I need two additional things. While it may be possible to scale a sprite I've already got a routine that allow users to draw there own sprites using polygons that is easy, simple and even people with no artistic ability, like me and I'm sure many of my future users, get good results.

I really, really want my old polygon routine. [That's me sitting on the floor in my diaper crying about it.]

Please don't point me to LineXY and FillArea. That doesn't do it.

Thanks, ken.

[Fred]

Did you try the search on the forums (in trick and tips) ? http://www.purebasic.fr/english/viewtop ... it=polygon

[Zach]

I'm assuming he did, because this uses methods he explicitly says he doesn't want to use / don't work for his needs.

All examples I came across of drawing polygons seems to use this method.

All I could find for GTK was this.

http://www.gtk.org/api/2.6/gdk/gdk-Draw ... tives.html

Code: Select all

void        gdk_draw_polygon                (GdkDrawable *drawable,
                                             GdkGC *gc,
                                             gboolean filled,
                                             GdkPoint *points,
                                             gint npoints);

Draws an outlined or filled polygon.

drawable�: a GdkDrawable (a GdkWindow or a GdkPixmap).
gc�: a GdkGC.
filled�: TRUE if the polygon should be filled. The polygon is closed automatically, connecting the last point to the first point if necessary.
points�: an array of GdkPoint structures specifying the points making up the polygon.
npoints�: the number of points.

[ken_anthony]

Of course I did Fred,

I value your time as much as I do mine. BTW, I also read the article you referenced, Joel on software, about why you should not do a clean sheet of software that's been worked on over the years. A lot to agree with there.

Before I would put my life in your hands Fred, which I did when I purchased your compiler for my livelihood, I had to judge your character and I have to say I am very impressed. Extremely impressed that you've dedicated yourself to producing something of quality which others can depend on. Because depend on you we do. Sincerely.

Zach, you found it, that's the one. Now I just need to figure out how to use it in PureBasic (a good exercise for me.)

Thank you both.

ken

[Shardik]

Unfortunately Zach's link to the gdk drawing primitives is an old one. You should always take a look into the most recent stable documentation. Here you would have seen that gdk_draw_polygon() has been deprecated in GDK 2.22:

Warning

gdk_draw_polygon has been deprecated since version 2.22 and should not be used in newly-written code. Use cairo_line_to() or cairo_append_path() and cairo_fill() or cairo_stroke() instead.

GTK+ started already in 2005 with version 2.8 to use Cairo to render the majority of its widgets.

Cairo is a software library used to provide a vector graphics-based, device-independent API for software developers. It is designed to provide primitives for 2-dimensional drawing across a number of different backends. Cairo is designed to use hardware acceleration[1] when available.

It's also strongly adviced to use Cairo instead of GDK:

Starting with GTK+ 2.8, GDK supports Cairo which should be used with GTK+ 3 instead of GDK.

I have already demonstrated in these examples how to use Cairo in PureBasic on Linux:
- Display running clock
- Demo of Cairo's compositing operators

This is a very simple example for drawing a filled polygon into a window using Cairo:

Code: Select all

EnableExplicit

ImportC ""
  gdk_cairo_create(*Drawable.GdkDrawable)
EndImport

ImportC "-lcairo"
  cairo_close_path(*CairoContext)
  cairo_destroy(*CairoContext)
  cairo_fill(*CairoContext)
  cairo_line_to(*CairoContext, x.D, y.D)
  cairo_set_source_rgb(*CairoContext, Red.D, Green.D, Blue.D)
EndImport

Structure Point
  x.D
  y.D
EndStructure

Dim PolygonPoints.Point(10)

ProcedureC WidgetExposeHandler(*Widget.GtkWidget, *Event.GdkEventExpose)
  Shared PolygonPoints.Point()

  Protected CairoContext.I
  Protected i.I

  CairoContext = gdk_cairo_create(*Widget\window)

  For i = 0 To ArraySize(PolygonPoints()) - 1
    cairo_line_to(CairoContext, PolygonPoints(i)\x, PolygonPoints(i)\y)
  Next i

  cairo_close_path(CairoContext)
  cairo_set_source_rgb(CairoContext, 1, 0, 0)
  cairo_fill(CairoContext)
  cairo_destroy(CairoContext)
EndProcedure

Define FixedBox.I
Define i.I

For i = 0 To 10
  Read.D PolygonPoints(i)\x
  Read.D PolygonPoints(i)\y
Next i

OpenWindow(0, 270, 100, 220, 200, "Polygon", #PB_Window_SizeGadget)
FixedBox = g_list_nth_data_(gtk_container_get_children_(gtk_bin_get_child_(WindowID(0))), 0)
g_signal_connect_data_(FixedBox, "expose-event", @WidgetExposeHandler(), 0, 0, #G_CONNECT_AFTER)
WidgetExposeHandler(FixedBox, 0)

Repeat
Until WaitWindowEvent() = #PB_Event_CloseWindow

End

DataSection
  Data.D 10, 85, 85, 75, 110, 10, 135, 75, 210, 85, 160, 125, 170, 190, 110, 150
  Data.D 50, 190, 60, 125, 10, 85
EndDataSection

[ken_anthony]

Thank you for the information Shardik.

It's disappointing to hear that their is no native polygon function available any longer for Linux (although it still exists in Windows.)

The good news for me is all my polygons will surround the origin or be translated from it so I don't have to figure out if my FillArea point is inside or outside.

This is why the software industry never matures. They keep moving the foundation. 30 years ago I worked for a company that ran 20 year old software on their mainframes. Plus the newer stuff I was writing.

Another issue is nobody agrees on what the primitives should be in a foundation. I consider polygon to be one of those primitives. I could even argue that line and point are not (now that's a bag of worms, so I better continue...)

Which is the primitive: line, point or polygon assuming you could only choose one? Most people would say it's obviously point because you can create all the others with it. Those people would be wrong. Because that same argument works for both line and polygon as well (plus there is the not so small issue of performance.) The reason the polygon function is the primitive is because point and line are simply data passed to polygon. Give it one point and you have point. Give it two points and you have line. But even better from the humble programmer standpoint. It not only eliminated the need for line and point. It eliminates the need for FillArea as well since it makes no sense to fill and area you haven't first defined.

Humble programmer is not just a phrase, it is an acknowledgement of using our strengths and weaknesses properly. Replacing four functions with one allows a programmer to do more. Supermen will always deny this simple truth of course.

[ken_anthony]

Shardik, I see you've changed your polygon to a filled red star.

What I would like to do is define this...

Code: Select all

Procedure polygon(hGadget, nPoints.Point(), nPosition.Point, nColor, bFill)

But I'm having some difficulty adapting your code due to my inexperience with PureBasic, Cairo, etc.

Where are GdkDrawable, CairoContext, GtkWidget, GdkEventExpose declared/defined?

Plus everything regarding FixedBox has me flummoxed.

[Shardik]

Shardik, I see you've changed your polygon to a filled red star.

What I would like to do is define this...

Code: Select all

Procedure polygon(hGadget, nPoints.Point(), nPosition.Point, nColor, bFill)

Please take a look into the new example below. You may now define a polygon by calling the procedure

Code: Select all

CreatePolygon(List PolygonPoint.Point(), x.D, y.D, Color.L, Fill.L)

and you have to pass a list with the polygon's points, the x and y coordinates for the polygon's position in the window, the color and whether you want your polygon to be filled:

Code: Select all

EnableExplicit

ImportC ""
  gdk_cairo_create(*Drawable.GdkDrawable)
EndImport

ImportC "-lcairo"
  cairo_close_path(*CairoContext)
  cairo_destroy(*CairoContext)
  cairo_fill(*CairoContext)
  cairo_line_to(*CairoContext, x.D, y.D)
  cairo_set_line_width(*CairoContext, LineWidth.D)
  cairo_set_source_rgb(*CairoContext, Red.D, Green.D, Blue.D)
  cairo_stroke(*CairoContext)
EndImport

Structure Point
  x.D
  y.D
EndStructure

Structure PolygonEntry
  ColorRed.D
  ColorGreen.D
  ColorBlue.D
  Fill.L
  List PolygonPoint.Point()
EndStructure

NewList Polygon.PolygonEntry()
NewList PolygonPoint.Point()

Procedure CreatePolygon(List PolygonPoint.Point(), x.D, y.D, Color.L, Fill.L)
  Shared Polygon.PolygonEntry()

  Protected ColorPart.L
  Protected i.I

  AddElement(Polygon())

  ForEach PolygonPoint()
    AddElement(Polygon()\PolygonPoint())
    Polygon()\PolygonPoint()\x = x + PolygonPoint()\x
    Polygon()\PolygonPoint()\y = y + PolygonPoint()\y
  Next

  ColorPart = (Color & $FF) / 255
  Polygon()\ColorRed = ColorPart
  ColorPart = ((Color >> 8) & $FF) / 255
  Polygon()\ColorGreen = ColorPart
  ColorPart = ((Color >> 16) & $FF) / 255
  Polygon()\ColorBlue = ColorPart
  Polygon()\Fill = Fill
EndProcedure

Procedure DrawPolygons(*Widget.GtkWidget)
  Shared Polygon.PolygonEntry()

  Protected CairoContext.I = gdk_cairo_create(*Widget\window)

  ForEach Polygon()
    If Polygon()\Fill
      ForEach Polygon()\PolygonPoint()
        cairo_line_to(CairoContext, Polygon()\PolygonPoint()\x, Polygon()\PolygonPoint()\y)
      Next

      cairo_close_path(CairoContext)
      cairo_set_source_rgb(CairoContext, Polygon()\ColorRed, Polygon()\ColorGreen, Polygon()\ColorBlue)
      cairo_fill(CairoContext)
    Else
      cairo_set_line_width(CairoContext, 1)
      cairo_set_source_rgb(CairoContext, Polygon()\ColorRed, Polygon()\ColorGreen, Polygon()\ColorBlue)

      ForEach Polygon()\PolygonPoint()
        cairo_line_to(CairoContext, Polygon()\PolygonPoint()\x, Polygon()\PolygonPoint()\y)
      Next

      cairo_close_path(CairoContext)
      cairo_stroke(CairoContext)
    EndIf
  Next

  cairo_destroy(CairoContext)
EndProcedure

ProcedureC WidgetExposeHandler(*Widget.GtkWidget, *Event.GdkEventExpose)
  DrawPolygons(*Widget.GtkWidget)
EndProcedure

Define FixedBox.I
Define i.I

; ----- Create Pentagon

For i = 1 To 5
  AddElement(PolygonPoint())
  Read.D PolygonPoint()\x
  Read.D PolygonPoint()\y
Next i

CreatePolygon(PolygonPoint(), 250, 200, RGB(255, 0, 0), #True)

; ----- Create Triangle

ClearList(PolygonPoint())

For i = 1 To 3
  AddElement(PolygonPoint())
  Read.D PolygonPoint()\x
  Read.D PolygonPoint()\y
Next i

CreatePolygon(PolygonPoint(), 20, 20, RGB(255, 0, 255), #False)

; ----- Create Octagon

ClearList(PolygonPoint())

For i = 1 To 8
  AddElement(PolygonPoint())
  Read.D PolygonPoint()\x
  Read.D PolygonPoint()\y
Next i

CreatePolygon(PolygonPoint(), 20, 250, RGB(255, 255, 0), #True)

; ----- Display window and define expose handler

OpenWindow(0, 270, 100, 500, 500, "Polygon demo", #PB_Window_SizeGadget)
SetWindowColor(0, 0)
FixedBox = g_list_nth_data_(gtk_container_get_children_(gtk_bin_get_child_(WindowID(0))), 0)
g_signal_connect_data_(FixedBox, "expose-event", @WidgetExposeHandler(), 0, 0, #G_CONNECT_AFTER)
WidgetExposeHandler(FixedBox, 0)

Repeat
Until WaitWindowEvent() = #PB_Event_CloseWindow

End

DataSection
  ; -- Pentagon
  Data.D   0,   0
  Data.D 150,   0
  Data.D 175,  75
  Data.D 150, 200
  Data.D  50, 125

  ; -- Triangle
  Data.D   0,  25
  Data.D 150,   0
  Data.D 175,  75

  ; -- Octagon
  Data.D  50,  50
  Data.D 100,  25
  Data.D 150,  50
  Data.D 175, 100
  Data.D 150, 150
  Data.D 100, 175
  Data.D  50, 150
  Data.D  25, 100
EndDataSection

But I'm having some difficulty adapting your code due to my inexperience with PureBasic, Cairo, etc.

Where are GdkDrawable, CairoContext, GtkWidget, GdkEventExpose declared/defined?

Plus everything regarding FixedBox has me flummoxed.

Most of the GTK API structures like GdkDrawable, GtkWidget etc. are predefined for you in PureBasic. Just type <Alt> + <S> and the structure viewer will be launched and you can locate and view the predefinded constants and structures. CairoContext is my own name creation because it's the graphics context you need for drawing. In most of the C source codes I have studied the variable is named cr.

FixedBox is a different thing: it's a GtkFixed structure. For drawing into a PureBasic window on Linux/GTK you need to know that a GTK window contains a GtkVBox which contains a GtkFixed into which you can draw your polygons or other stuff. In order to prevent the erasing of your drawings you have to define a callback or handler (WidgetExposeHandler in my examples) which receives control if the content of your window is changed or refreshed (like during a window resize). In GTK you connect a signal for this "expose-event" so you can react to it by simply redrawing your window contents...

This is a step-by-step approach to obtain the pointers to the GtkVBox and GtkFixed which I stuffed into one line in the previous examples:

Code: Select all

EnableExplicit

Define ChildrenList.I
Define FixedBox.I
Define VBox.I
Define *WidgetName

OpenWindow(0, 200, 100, 200, 200, "Test window")
VBox = gtk_bin_get_child_(WindowID(0))
*WidgetName = gtk_widget_get_name_(VBox)
Debug PeekS(*WidgetName) + " = " + Str(VBox)
ChildrenList = gtk_container_get_children_(VBox)
FixedBox = g_list_nth_data_(ChildrenList, 0)
*WidgetName = gtk_widget_get_name_(FixedBox)
Debug PeekS(*WidgetName) + " = " + Str(FixedBox)

Repeat
Until WaitWindowEvent() = #PB_Event_CloseWindow

[ken_anthony]

Wow. Just what I wanted. Much better than the feeble attempt I've been working on.

...and you took out hGadget which I also figured out didn't belong.

...and include translation which I intended.

Shardik, you're an absolute magician.

I will definitely be taking a closer look at the structure viewer tool.

I did realize that WidgetExposeHandler was a callback but some of the syntax confused me a bit. I'm assuming @ is an address of operator? ...and #G_CONNECT_AFTER is required for a callback?

Also, would I use zero in WindowID(0) normally?

[Zach]

I believe the X in WindowID(X) should actually correspond to the application window's internal number. So if use use 0 for an ID by default then yes, or if you use 1, or 100, you just change to reflect that.

This is a Chapter on Pointers and Memory Access in the PB Help file, but I think it is somewhat kind of hidden. I actually had to find it through other pages (or maybe I am blind), but you can also find it by opening the help CHM and switching to the search tab. type in "pointers" and halfway down the results list, is the Chapter titled "Pointers and memory access"..

I hate pointers in any language. They are confusing... so I just stay away from them, personally

[Shardik]

I did realize that WidgetExposeHandler was a callback but some of the syntax confused me a bit. I'm assuming @ is an address of operator?

The @ denotes to jump to the address of the procedure WidgetExposeHandler() for callback.

...and #G_CONNECT_AFTER is required for a callback?

g_signal_connect_data_() is an extended function with more parameters than the shorter function g_signal_connect_(). I had simply copied it from a source code drawing a transparent button. In that case the #G_CONNECT_AFTER was a necessity because first the background surroundings of the button's rounded edges had to be drawn before the transparent button itself could be drawn. In our polygon example #G_CONNECT_AFTER is not necessary. The API function may therefore be shortened to

Code: Select all

g_signal_connect_(FixedBox, "expose-event", @WidgetExposeHandler(), 0)

Also, would I use zero in WindowID(0) normally?

No, for most cases I would advise to use #PB_ANY for #Window.

[ken_anthony]

I'm almost there except for one more hurdle. I've got this...

Code: Select all

Define FixedBox.I
Procedure OpenMain()
    wMain = OpenWindow(#PB_Any, 0, 0, 1000, 500, "Ken's first project written in PureBasic", #PB_Window_Maximize)
    SetWindowColor(wMain, 0)
    FixedBox = g_list_nth_data_(gtk_container_get_children_(gtk_bin_get_child_(WindowID(wMain))), 0)
    g_signal_connect_data_(FixedBox, "expose-event", @WidgetExposeHandler(), 0, 0, #G_CONNECT_AFTER)
    WidgetExposeHandler(FixedBox, 0)
EndProcedure

Procedure wMain_Events(event)
  Select event
    Case #PB_Event_CloseWindow
        End
  EndSelect
EndProcedure

OpenMain()

Repeat  :  wMain_Events(WaitWindowEvent()) : ForEver

Then I can put this code...

Code: Select all

Define i.I
ClearList(PolygonPoint())
For i = 1 To 5
  AddElement(PolygonPoint())
  Read.D PolygonPoint()\x
  Read.D PolygonPoint()\y
Next i
CreatePolygon(PolygonPoint(), 250, 200, RGB(255, 0, 0), #True)

...before or after the OpenMain() and it works fine... And it works when put into a separate included file...

So I assumed I could put it into a procedure called on a button click but my polygon no longer appears although I know the procedure is being called because clicking a second time runs out of data to read.

I assumed I needed Shared PolygonPoint() which is the first line of the procedure.

I'm sure it's something very simple I'm missing.

[Zach]

It might be best to post the code that is non-working in a useable context, otherwise we'd just be guessing at what you "might" have done wrong somewhere.

[ken_anthony]

Zach, that is perfectly reasonable, so here ya go. My project has about 15 files in it already, so I've cut that down to just what's relevant (3 files which works fine before the change I will show you below.)

The main file:

Code: Select all

Global wMain

Enumeration
#m1    
EndEnumeration

Structure Point
  x.D
  y.D
EndStructure

Structure PolygonEntry
  ColorRed.D
  ColorGreen.D
  ColorBlue.D
  Fill.L
  List PolygonPoint.Point()
EndStructure

Global NewList Polygon.PolygonEntry()
Global NewList PolygonPoint.Point()
IncludeFile "/home/ken/PureBasic/polygon.Shardik"
IncludeFile "/home/ken/PureBasic/CreatePolygon.test"

; ----- Display window and define expose handler
Define FixedBox.I
Procedure OpenMain()
  wMain = OpenWindow(#PB_Any, 270, 100, 500, 500, "Polygon demo", #PB_Window_SizeGadget)
  SetWindowColor(wMain, 0)
  FixedBox = g_list_nth_data_(gtk_container_get_children_(gtk_bin_get_child_(WindowID(wMain))), 0)
  g_signal_connect_data_(FixedBox, "expose-event", @WidgetExposeHandler(), 0, 0, #G_CONNECT_AFTER)
  WidgetExposeHandler(FixedBox, 0)
  
   CreateMenu(0, WindowID(wMain))
    MenuTitle("test")
    MenuItem(#m1, "Do_test")
EndProcedure  

Procedure wMain_Events(event)
  Select event
    Case #PB_Event_CloseWindow
        End
        
    Case #PB_Event_Menu
        Select EventMenu()
            Case #m1
                ;Does_Not_Work()
        EndSelect
  EndSelect
EndProcedure

OpenMain()
Repeat  :  wMain_Events(WaitWindowEvent()) : ForEver

The first include file:

Code: Select all

ImportC ""
  gdk_cairo_create(*Drawable.GdkDrawable)
EndImport

ImportC "-lcairo"
  cairo_close_path(*CairoContext)
  cairo_destroy(*CairoContext)
  cairo_fill(*CairoContext)
  cairo_line_to(*CairoContext, x.D, y.D)
  cairo_set_line_width(*CairoContext, LineWidth.D)
  cairo_set_source_rgb(*CairoContext, Red.D, Green.D, Blue.D)
  cairo_stroke(*CairoContext)
EndImport

Procedure CreatePolygon(List PolygonPoint.Point(), x.D, y.D, Color.L, Fill.L)
  Shared Polygon.PolygonEntry()

  Protected ColorPart.L
  Protected i.I

  AddElement(Polygon())

  ForEach PolygonPoint()
    AddElement(Polygon()\PolygonPoint())
    Polygon()\PolygonPoint()\x = x + PolygonPoint()\x
    Polygon()\PolygonPoint()\y = y + PolygonPoint()\y
  Next

  ColorPart = (Color & $FF) / 255
  Polygon()\ColorRed = ColorPart
  ColorPart = ((Color >> 8) & $FF) / 255
  Polygon()\ColorGreen = ColorPart
  ColorPart = ((Color >> 16) & $FF) / 255
  Polygon()\ColorBlue = ColorPart
  Polygon()\Fill = Fill
EndProcedure

Procedure DrawPolygons(*Widget.GtkWidget)
  Shared Polygon.PolygonEntry()

  Protected CairoContext.I = gdk_cairo_create(*Widget\window)

  ForEach Polygon()
    If Polygon()\Fill
      ForEach Polygon()\PolygonPoint()
        cairo_line_to(CairoContext, Polygon()\PolygonPoint()\x, Polygon()\PolygonPoint()\y)
      Next

      cairo_close_path(CairoContext)
      cairo_set_source_rgb(CairoContext, Polygon()\ColorRed, Polygon()\ColorGreen, Polygon()\ColorBlue)
      cairo_fill(CairoContext)
    Else
      cairo_set_line_width(CairoContext, 1)
      cairo_set_source_rgb(CairoContext, Polygon()\ColorRed, Polygon()\ColorGreen, Polygon()\ColorBlue)

      ForEach Polygon()\PolygonPoint()
        cairo_line_to(CairoContext, Polygon()\PolygonPoint()\x, Polygon()\PolygonPoint()\y)
      Next

      cairo_close_path(CairoContext)
      cairo_stroke(CairoContext)
    EndIf
  Next

  cairo_destroy(CairoContext)
EndProcedure

ProcedureC WidgetExposeHandler(*Widget.GtkWidget, *Event.GdkEventExpose)
  DrawPolygons(*Widget.GtkWidget)
EndProcedure

The second include file:

Code: Select all

;Procedure Does_Not_Work()
Define i.I
For i = 1 To 5
  AddElement(PolygonPoint())
  Read.D PolygonPoint()\x
  Read.D PolygonPoint()\y
Next i
CreatePolygon(PolygonPoint(), 250, 200, RGB(255, 0, 0), #True)
;EndProcedure

DataSection
  ; -- Pentagon
  Data.D   0,   0
  Data.D 150,   0
  Data.D 175,  75
  Data.D 150, 200
  Data.D  50, 125
EndDataSection

Now uncomment ;Does_Not_Work() in the main file and ;Procedure Does_Not_Work() and ;EndProcedure in the second include file.

This time when you run the program the red polygon does not show up which is correct, but Do_Test menu item seems to do nothing, Do_Test twice and you will see that it has run and is now out of data.

Like I said, I'm sure I'm missing something simple.

[ken_anthony]

The importance of this is if I can't call CreatePolygon from within a procedure it because an almost totally worthless function.