- Screen Shot 2024-10-08 at 4.29.16 pm.png (6.35 KiB) Viewed 4383 times
Magic!
Code: Select all
public handler OnPaint()
variable tColor as Color
variable tRectPath as Path -- remember to declare variables before using them
put rectangle path of my bounds into tRectPath -- 'my bounds' is the widget's view port / clipping rect
-- log[the instructions of tRectPath]
set the paint of this canvas to my background paint
fill tRectPath on this canvas
------- INSERTED CODE ------
variable tPath as Path -- declare a canvas 'path' type variable to hold our drawing commands
set the paint of this canvas to solid paint with color [0.0, 0.0, 0.0, 1.0]
put the empty path into tPath -- init new blank path
move to point [ 0, my height ] on tPath -- starting point left,bottom
line to point [ my width, my height ] on tPath -- draw line to right,bottom
line to point [ my width, 0 ] on tPath -- draw line upwards to right,top
close path on tPath -- closing the path adds a line that connects it back to the starting point
fill tPath on this canvas
log[the instructions of tPath] -- just for development, check the canvas path string
----------------------------
set the paint of this canvas to my foreground paint
set the stroke width of this canvas to 4
stroke tRectPath on this canvas -- draw the line around our widget's rectangle
if mLabel is not nothing then
set the font of this canvas to my font
-- fill text mLabel at point [ my width /2 , my height / 2 ] on this canvas
fill text mLabel at center of my bounds on this canvas
end if
end handler
Code: Select all
set the paint of this canvas to solid paint with color [0.0, 0.0, 0.0, 1.0]
This has little to do with this topic.richmond62 wrote: ↑Tue Oct 08, 2024 2:17 pm How do simple folk like myself get access to all the wonderful things you doing if we are stuck with RC3/4?
Hmmm?Logical CPU: 1
Error Code: 0x00000006 (no mapping for user data write)
Trap Number: 14
Code: Select all
public handler OnPaint()
variable tColor as Color
variable tRectPath as Path -- remember to declare variables before using them
variable tInsetRect as Rectangle
put rectangle path of my bounds into tRectPath -- 'my bounds' is the widget's view port / clipping rect
-- log[the instructions of tRectPath]
set the paint of this canvas to solid paint with color [0.5, 0.5, 0.5, 1.0]
fill tRectPath on this canvas
set the paint of this canvas to my foreground paint
set the stroke width of this canvas to 4
put rectangle [8,8, my width - 8, my height - 8 ] into tInsetRect -- 'my bounds' is the widget's view port / clipping rect
variable tPath as Path -- declare a canvas 'path' type variable to hold our drawing commands
set the paint of this canvas to solid paint with color [0.0, 0.0, 0.0, 1.0]
put the empty path into tPath -- init new blank path
move to point [ 0, my height ] on tPath -- starting point left,bottom
line to point [ my width, my height ] on tPath -- draw line to right,bottom
line to point [ my width, 0 ] on tPath -- draw line upwards to right,top
line to point [ the right of tInsetRect, the top of tInsetRect ] on tPath -- draw line to right,top of inset rect
line to point [ the right of tInsetRect, the bottom of tInsetRect ] on tPath -- draw to to bottom right of inset rect
line to point [ the left of tInsetRect, the bottom of tInsetRect ] on tPath -- draw line to bottom left of inset rect
-- line to point [ 0, my height ] on tPath -- draw line back to starting point, but not needed as 'close path' will do this.
close path on tPath -- closing the path adds a line that connects it back to the starting point
fill tPath on this canvas
log[the instructions of tPath] -- just for development, check the canvas path string
set the paint of this canvas to my background paint
put rectangle path of tInsetRect into tRectPath
fill tRectPath on this canvas
if mLabel is not nothing then
set the paint of this canvas to my foreground paint
set the font of this canvas to my font
-- fill text mLabel at point [ my width /2 , my height / 2 ] on this canvas
fill text mLabel at center of my bounds on this canvas
end if
end handler
Logical CPU: 1
Error Code: 0x00000006 (no mapping for user data write)
Trap Number: 14
mach_vm in this context is virtual memory. That error means there's no data in memory available to access at that offset.OpenXTalkPaul wrote: ↑Tue Oct 08, 2024 2:30 pm Hmmm?
Also not sure what 'mach_vm' is? Did Apple make the mach kernel into a virtual machine?
Emphasis mine, that's probably where your issue is. There's no telling if Apple are currently 'playing' with how virtual memory is allocated and referenced. 16GB is probably required on MacOS these days, otherwise things are loaded into and out of virtual memory swap constantly. (I would agree with "people here" who would advocate 16GB of RAM and higher.)richmond62 wrote: ↑Tue Oct 08, 2024 4:03 pm I am running MacOS 15.1 beta 6 directly on a 2018 Mac Mini (INTEL) with 8 GB RAM.
Code: Select all
private variable mBevelWidth as Number
property bevelWidth get mBevelWidth set setBevelWidth
metadata bevelWidth.label is "Bevel Width"
metadata bevelWidth.section is "Basic"
metadata bevelWidth.editor is "com.livecode.pi.number"
metadata bevelWidth.step is "1"
metadata bevelWidth.min is "0"
metadata bevelWidth.max is "255"
metadata bevelWidth.default is "0"
metadata bevelWidth.user_visible is "true"
public handler setBevelWidth( in pBevelWidth as optional Number)
if pBevelWidth is nothing then
put 0 into mBevelWidth -- make sure it has a numeric value even if it is set to 'empty'
else
put pBevelWidth into mBevelWidth
end if
redraw all
end handler
Code: Select all
put rectangle [mBevelWidth, mBevelWidth , my width - mBevelWidth, my height - mBevelWidth ] into tInsetRect
Thanks TerryL - Added.
I've added this as part 2, and can always add the next as part 3.OpenXTalkPaul wrote: ↑Tue Oct 08, 2024 6:05 pm Thanks @TerryL for collecting this stuff into standalone documents, I do appreciate it. However, you may want to hold off until I finish working on this tutorial. Almost done with this one, I think.
--- continued ---If we click this 'button' (widget), it receives the mouseDown/Up messages we posted to the engine, but there is no visual indication that the 'button' is being pressed when the mouse is down. So for this I will mirror the behabior of 'classic' rectangle buttons that can do bevels. That is, we'll simply swap the colors of the top bevel and the bottom bevel, so that it will appear to be 'debossed' (beveled inwards) rather than embossed (beveled outwards).
Code: Select all
private variable mHighlighted as optional Boolean
Code: Select all
private variable mMouseButton as optional Number
Code: Select all
private variable mMouseButton as optional Number
private variable mHighlighted as Boolean
public handler OnMouseDown()
put the click button into mMouseButton
put true into mHighlighted
post "mouseDown" && mMouseButton formatted as string
redraw all
end handler
public handler OnMouseUp()
put false into mHighlighted
post "mouseUp" && mMouseButton formatted as string
put nothing into mMouseButton -- change the Mouse Button state variable back to 'undefined' again.
redraw all
end handler
Code: Select all
public handler OnPaint()
variable tRectPath as Path -- remember to declare variables before using them
variable tInsetRect as Rectangle
-------------- Top Bevel ------------------
put rectangle path of my bounds into tRectPath -- 'my bounds' is the widget's view port / clipping rect
if mHighlighted then
set the paint of this canvas to solid paint with color [0.0, 0.0, 0.0, 1.0]
else
set the paint of this canvas to solid paint with color [0.5, 0.5, 0.5, 1.0]
end if
fill tRectPath on this canvas
-------------- Bottom Bevel ------------------
set the paint of this canvas to my foreground paint
set the stroke width of this canvas to 4
put rectangle [8,8, my width - 8, my height - 8 ] into tInsetRect -- 'my bounds' is the widget's view port / clipping rect
variable tPath as Path -- declare a canvas 'path' type variable to hold our drawing commands
put the empty path into tPath -- init new blank path
move to point [ 0, my height ] on tPath -- starting point left,bottom
line to point [ my width, my height ] on tPath -- draw line to right,bottom
line to point [ my width, 0 ] on tPath -- draw line upwards to right,top
line to point [ the right of tInsetRect, the top of tInsetRect ] on tPath -- draw line to right,top of inset rect
line to point [ the right of tInsetRect, the bottom of tInsetRect ] on tPath -- draw to to bottom right of inset rect
line to point [ the left of tInsetRect, the bottom of tInsetRect ] on tPath -- draw line to bottom left of inset rect
close path on tPath -- closing the path adds a line that connects it back to the starting point
if mHighlighted then
set the paint of this canvas to solid paint with color [0.5, 0.5, 0.5, 1.0]
else
set the paint of this canvas to solid paint with color [0.0, 0.0, 0.0, 1.0]
end if
fill tPath on this canvas
-------------- Inner Rectangle ------------------
set the paint of this canvas to my background paint
put rectangle path of tInsetRect into tRectPath
fill tRectPath on this canvas
-------------- Label Text ------------------
if mLabel is not nothing then
set the paint of this canvas to my foreground paint
set the font of this canvas to my font
-- fill text mLabel at point [ my width /2 , my height / 2 ] on this canvas
fill text mLabel at center of my bounds on this canvas
end if
end handler
Code: Select all
/**
Syntax:
set the highlight of <widget> to {true|false}
get the highlight of <widget>
Summary: `true` if the widget is highlighted; `false` otherwise
Description:
Use the `highlight` property to test or control whether the button-bevel appears
pressed inwards indicating highlighted or not.
*/
private variable mHighlighted as Boolean
property "highlight" get mHighlighted set setHighlighted
metadata highlight.label is "Hilited"
metadata highlight.section is "Basic"
metadata highlight.editor is "com.livecode.pi.boolean"
metadata highlight.default is "false"
metadata highlight.user_visible is "true"
--- synonym ----
property hilite get mHighlighted set setHighlighted
metadata hilite.user_visible is "false"
public handler setHighlighted( in pHighlighted as Boolean)
put pHighlighted into mHighlighted
redraw all
end handler
Code: Select all
metadata hilite.user_visible is "false"
Getting back to those mouse events....
Code: Select all
public handler OnMouseLeave()
if mMouseButton is not nothing then --- checks if the mouse button is still down
--- if the mouse is still down then only un-highlight the button
put false into mHighlighted
--- we can have a corresponding OnMouseEnter handler that re-highlights the button if the mouse button is still down
end if
post "mouseLeave"
redraw all
end handler
Code: Select all
public handler OnMouseEnter()
if mMouseButton is not nothing then --- checks if the mouse button is still down
--- if the mouse is still down then only RE-highlight the button
put true into mHighlighted
end if
post "mouseEnter"
redraw all
end handler
Code: Select all
/**
Description: A button widget that has properties commonly found in xTalk 'Button' objects.
Name: mouseDown
Type: message
Name: mouseUp
Type: message
Name: backgroundColor
Type: property
Name: foregroundColor
Type: property
*/
widget org.openxtalk.widget.oxtuikitbutton
metadata title is "Button-Widget-Demo" -- will be the displayed name for the control in the IDE.
metadata author is "Paul McClernan for OpenXTalk.org" -- writing credits
metadata version is "0.0.1" -- version num gets tracked on to the package name when an extension is packed as .lce
metadata preferredSize is "64,128" -- default Height,Width for new instance if the templateWidget has was not set
metadata _ide is "true" -- indicates module is a part of the IDE therefore is non-unloadable.
metadata userVisible is "true" --indicates if users see the module in listings or hides widgets from the Tools palette.
metadata svgicon is "" -- "M0,0v69.6c0,1.4,1.1,2.5,2.... z" -- SVG path string to use for the modules Icon in listings in the IDE.
-- dependancy declarations
use com.livecode.canvas
use com.livecode.string
use com.livecode.char
use com.livecode.array
use com.livecode.list
use com.livecode.widget
use com.livecode.engine
use com.livecode.library.widgetutils
--------- metadata for built-in properties ---------
private variable mForeColor as Color
property foregroundColor get getForeColor set mForeColor
metadata foregroundColor.label is "Foreground Color"
private handler getForeColor() returns String
return colorToString( mForeColor, false)
end handler
private variable mBackColor as Color
property backgroundColor get getBackColor set mBackColor
metadata backgroundColor.label is "Background Color"
private handler getBackColor() returns String
return colorToString( mBackColor, false)
end handler
/**
Name: label
type: property
*/
private variable mLabel as optional String
property label get mLabel set setLabel
metadata label.default is "Label"
private handler setLabel(in pLabel as String)
put pLabel into mLabel
redraw all
end handler
/**
Syntax:
set the highlight of <widget> to {true|false}
get the highlight of <widget>
Summary: `true` if the widget is highlighted; `false` otherwise
Description:
Use the `highlight` property to test or control whether the button-bevel appears
pressed inwards indicating highlighted or not.
*/
private variable mHighlighted as Boolean
property "highlight" get mHighlighted set setHighlighted
metadata highlight.label is "Hilited"
metadata highlight.section is "Basic"
metadata highlight.editor is "com.livecode.pi.boolean"
metadata highlight.default is "false"
metadata highlight.user_visible is "true"
--- synonym ----
property hilite get mHighlighted set setHighlighted
metadata hilite.user_visible is "false"
public handler setHighlighted( in pHighlighted as Boolean)
put pHighlighted into mHighlighted
redraw all
end handler
public handler OnCreate()
------- INTITIALIZE PROPERTY VARIABLES TO THIER DEFAULT VALUES HERE -------
put the color of my foreground paint into mForeColor
put the color of my background paint into mBackColor
put 3 into mBevelWidth
put "Label" into mLabel
put false into mHighlighted
redraw all
end handler
private variable mE as scriptObject
public handler OnOpen()
put my script object into mE
log [mE] -- the log command very useful for debugging, it outputs to the text field in the Extension Builder stack.
redraw all
log "Open"
variable tRectPath as Path -- remember to declare variables before using them
put rectangle path of my bounds into tRectPath -- 'my bounds' is the widget's view port / clipping rect
end handler
public handler OnSave(out rProperties as Array)
put colorToString(mBackColor, false) into rProperties["backgroundColor"]
put colorToString(mForeColor, false) into rProperties["foregroundColor"]
put mHighlighted into rProperties["hilite"]
put mLabel into rProperties["label"]
end handler
-- this handler is called when the widget is loaded
public handler OnLoad(in pProperties as Array)
log "Load"
-- log [pProperties] --> logging this doesn't seem to work! -- moreover, it silently fails making debugging difficult
put stringToColor(pProperties["backgroundColor"]) into mBackColor
put stringToColor(pProperties["foregroundColor"]) into mForeColor
put pProperties["hilite"] into mHighlighted
put pProperties["label"] into mLabel
-- OnGeometryChanged()
redraw all
end handler
private variable mBevelWidth as Number
property bevelWidth get mBevelWidth set setBevelWidth
metadata bevelWidth.label is "Bevel Width"
metadata bevelWidth.section is "Basic"
metadata bevelWidth.editor is "com.livecode.pi.number"
metadata bevelWidth.step is "1"
metadata bevelWidth.min is "0"
metadata bevelWidth.max is "255"
metadata bevelWidth.default is "4"
metadata bevelWidth.user_visible is "true"
public handler setBevelWidth( in pBevelWidth as optional Number)
if pBevelWidth is nothing then
put 0 into mBevelWidth
else
put pBevelWidth into mBevelWidth
end if
redraw all
end handler --- setBevelWidth
public handler OnPaint()
variable tRectPath as Path -- remember to declare variables before using them
variable tInsetRect as Rectangle
-------------- Top Bevel ------------------
put rectangle path of my bounds into tRectPath -- 'my bounds' is the widget's view port / clipping rect
if mHighlighted is true then
set the paint of this canvas to solid paint with color [0.0, 0.0, 0.0, 1.0]
else
set the paint of this canvas to solid paint with color [0.5, 0.5, 0.5, 1.0]
end if
fill tRectPath on this canvas
-------------- Bottom Bevel ------------------
set the paint of this canvas to my foreground paint
set the stroke width of this canvas to 2
put rectangle [ mBevelWidth , mBevelWidth, my width - mBevelWidth, my height - mBevelWidth ] into tInsetRect
variable tPath as Path -- declare a new canvas 'path' type variable to hold our drawing commands
put the empty path into tPath -- init new blank path
move to point [ 0, my height ] on tPath -- starting point left,bottom
line to point [ my width, my height ] on tPath -- draw line to right,bottom
line to point [ my width, 0 ] on tPath -- draw line upwards to right,top
line to point [ the right of tInsetRect, the top of tInsetRect ] on tPath -- draw line to right,top of inset rect
line to point [ the right of tInsetRect, the bottom of tInsetRect ] on tPath -- draw to to bottom right of inset rect
line to point [ the left of tInsetRect, the bottom of tInsetRect ] on tPath -- draw line to bottom left of inset rect
-- line to point [ 0, my height ] on tPath -- draw line back to starting point
close path on tPath -- closing the path adds a line that connects it back to the starting point
-- log[the instructions of tPath] -- just for development, check the canvas path string
if mHighlighted is true then
set the paint of this canvas to solid paint with color [0.5, 0.5, 0.5, 1.0]
else
set the paint of this canvas to solid paint with color [0.0, 0.0, 0.0, 1.0]
end if
fill tPath on this canvas
-------------- Inner Rectangle ------------------
set the paint of this canvas to my background paint
put rectangle path of tInsetRect into tRectPath
fill tRectPath on this canvas
-------------- Label Text ------------------
if mLabel is not nothing then
set the paint of this canvas to my foreground paint
set the font of this canvas to my font
-- fill text mLabel at point [ my width /2 , my height / 2 ] on this canvas
fill text mLabel at center of my bounds on this canvas
end if
end handler
private variable mMouseButton as optional Number
public handler OnMouseDown()
put the click button into mMouseButton
setHighlighted( true )
post "mouseDown" && mMouseButton formatted as string
-- nice trick from HH:
-- post "set width of me to 230; set height of me to 115"
redraw all
end handler
public handler OnMouseUp()
setHighlighted( false )
post "mouseUp" && mMouseButton formatted as string
redraw all
put nothing into mMouseButton -- change the Mouse Button state variable back to 'undefined' again.
end handler
public handler OnMouseLeave()
if mMouseButton is not nothing then --- checks if the mouse button is still down
--- if the mouse is still down then only UN-highlight the button
put false into mHighlighted
--- we can have a corresponding OnMouseEnter handler that re-highlights the button if the mouse button is still down
end if
post "mouseLeave"
redraw all
end handler
public handler OnMouseEnter()
if mMouseButton is not nothing then --- checks if the mouse button is still down
--- if the mouse is still down then only RE-highlight the button
put true into mHighlighted
end if
post "mouseEnter"
redraw all
end handler
end widget
Code: Select all
• abbrevId,
• abbrevName
• abbrevOwner
• altId
• backColor
• backPattern
• backPixel
• blendLevel
• borderColor
• borderPattern
• borderPixel
• bottom
• bottomColor
• bottomLeft
• bottomPattern
• bottomPixel
• bottomRight
• brushColor
• cantSelect
• colors
• customKeys
• customProperties
• customPropertySet
• customPropertySets
• disabled,
• enabled
• focusColor
• focusPattern
• focusPixel
• foreColor
• forePattern
• forePixel
• height
• hiliteColor
• hilitePattern
• hilitePixel
• ink
• invisible
• kind
• layer
• layerMode
• left
• location
• lockLocation
• longId
• longName
• longOwner
• name
• number
• owner
• parentScript
• patterns
• penColor
• properties
• rectangle
• right
• script
• selected
• shadowColor
• shadowPattern
• shadowPixel
• shortId
• shortName
• shortOwner
• textFont
• textSize
• textStyle
• themeControlType
• toolTip
• top
• topColor
• topLeft
• topPattern
• topPixel
• topRight
• traversalOn
• unicodeToolTip
• visible
• width
Code: Select all
he paint of mCanvas -- set the paint of this canvas to solid paint with color [0,0,1,0.5] -- Blue with 50% tranparency
the antialias of mCanvas -- set the antialias of this canvas to false -- sometimes antialias looks sharper for fine details on low resolution screens
the opacity of mCanvas -- set the opacity of this canvas to 0.5
the blend mode of mCanvas -- set the blend mode of this canvas to "color dodge"
the stroke width of mCanvas -- set the stroke width of this canvas to 8
the fill rule of mCanvas -- set the fill rule of this canvas to "non-zero"
the cap style of mCanvas -- set the cap style of this canvas to "round"
the clipping bounds of mCanvas
the dashes of mCanvas
the dash phase of mCanvas
the font of mCanvas -- set the font of this canvas to font "Arial" at size 20
the bold of mFont -- set the bold of tFont to true
the image resize quality of mCanvas -- set the image resize quality of this canvas to "low"
the join style of mCanvas -- set the join style of this canvas to "bevel"
the miter limit of mCanvas -- set the miter limit of this canvas to 1.5
the stippled of mCanvas -- set the stippled of this canvas to true
Colors:
the red/green/blue of mColor -- set the blue of tColor to 1
the alpha of mColor -- put the alpha of tColor into tAlpha -- set the alpha of tColor to 0.5
Effects:
the blend mode of mEffect -- set the blend mode of tEffect to "color dodge"
the angle of mEffect
etc.
etc.
-- Widget properties are also used In the Widget module 'com.livecode.widget'
-- Widgets can also place 'child-widgets', using this feature has been called 'composed widgets'.
-- There's a 'Widget' variable type for variable declarations to store references to other widgets.
the enabled of mWidget -- my enabled
the font of Widget -- my Font
Code: Select all
set property "name" of my script object to "SuperWidget"
resolve script object "this stack" -- would return the stack that a widget is placed in.
-- resolved scriptObjects value is equivalent to 'the long name of'.
-- The return value is placed into the special global variable ''the result'.
set property "invisible" of the result to true
get property "script" of my script object
--- Snippet required to ENABLE KEYBOARD-INPUT-FOCUS:
set property "traversalOn" of my script object to "true"
execute script "focus on me" in my script object
-- SYNTAX: execute script tScript [ in Object ] [ with Arguments ]
Users browsing this forum: No registered users and 1 guest