Users complain boring user interface of my apps

Everything else that doesn't fall into one of the other PB categories.
User avatar
Kiffi
Addict
Addict
Posts: 1196
Joined: Tue Mar 02, 2004 1:20 pm
Location: Amphibios 9

Re: Users complain boring user interface of my apps

Post by Kiffi »

the.weavster wrote:JVM :D
Java :cry:
B4J :D
Hygge
User avatar
the.weavster
Addict
Addict
Posts: 1378
Joined: Thu Jul 03, 2003 6:53 pm
Location: England

Re: Users complain boring user interface of my apps

Post by the.weavster »

Kiffi wrote:B4J :D
Cool :)

I notice Jython has just sprung back to life too. Maybe they're hoping make hay out of CPython 2.7 being EOL in January.
IdeasVacuum
Always Here
Always Here
Posts: 6380
Joined: Fri Oct 23, 2009 2:33 am
Location: Wales, UK
Contact:

Re: Users complain boring user interface of my apps

Post by IdeasVacuum »

It should be possible to write your GUI in HTML and CSS, displayed via a WebGadget.

Or indeed Spider Basic might be the answer.
IdeasVacuum
If it sounds simple, you have not grasped the complexity.
wayne-c
Enthusiast
Enthusiast
Posts: 307
Joined: Tue Jun 08, 2004 10:29 am
Location: Zurich, Switzerland

Re: Users complain boring user interface of my apps

Post by wayne-c »

IdeasVacuum wrote:It should be possible to write your GUI in HTML and CSS, displayed via a WebGadget.
Exactly what I did for my commercial project: PureBasic Server and Client with all GUI in a WebGadget.

Users never! complained about a boring interface, on the contrary, I always get compliments for the UI. We use our own JavaScript framework and styles where - of course - we put a lot of effort in to look professional (we have Clients for Windows, MacOS and iOS).

What I would really like to have is better access to JavaScript (both directions) in the WebGadget, for both Windows and MacOS. This is done in a very hacky way by now (but it works).
As you walk on by, Will you call my name? Or will you walk away?
IdeasVacuum
Always Here
Always Here
Posts: 6380
Joined: Fri Oct 23, 2009 2:33 am
Location: Wales, UK
Contact:

Re: Users complain boring user interface of my apps

Post by IdeasVacuum »

Hi wayne-c

I would expect Spider Basic to be the solution by now - but if not, perhaps a GUI defined with Spider and the remainder with PB.
IdeasVacuum
If it sounds simple, you have not grasped the complexity.
Dynamic Ditto
New User
New User
Posts: 3
Joined: Sat Feb 16, 2019 4:45 am

Re: Users complain boring user interface of my apps

Post by Dynamic Ditto »

What about this? I haven't looked into the finer details regarding its usage, though. It's MIT licensed.

https://lcui.org
Cyllceaux
Enthusiast
Enthusiast
Posts: 344
Joined: Mon Jun 23, 2014 1:18 pm
Contact:

Re: Users complain boring user interface of my apps

Post by Cyllceaux »

Dynamic Ditto wrote:What about this? I haven't looked into the finer details regarding its usage, though. It's MIT licensed.

https://lcui.org
Uh... this looks nice... and is really small (1,7MB x64 / 349KB x86).
I will give it a try
Little John
Addict
Addict
Posts: 4000
Joined: Thu Jun 07, 2007 3:25 pm
Location: Berlin, Germany

Re: Users complain boring user interface of my apps

Post by Little John »

A reference to the work of firace should not be missing here:
SWV: A simple HTML/JS desktop GUI engine for PB
Please excuse my flawed English. My native language is PureBasic.
Search
RSBasic's backups
purenet
User
User
Posts: 29
Joined: Wed Oct 21, 2009 10:11 am

Re: Users complain boring user interface of my apps

Post by purenet »

Hi,

Please look an excellent PureBasic UI modules created by Thorsten1867.
There is several modules (SwitchGadget, ButtonEx, etc..) available to create modern UI's.

purenet
Cyllceaux
Enthusiast
Enthusiast
Posts: 344
Joined: Mon Jun 23, 2014 1:18 pm
Contact:

Re: Users complain boring user interface of my apps

Post by Cyllceaux »

I make some Tests with LCUI. https://lcui.org/#get-started

(Lib size ~400KB up to ~1,7MB)


It is easy to use, but has big problems with DPI.
a simple test has a XML for structure, CSS for style and Code... really simple code.


CSS:

Code: Select all

textview.text-hello {
    font-size: 18px;
    font-family: "Segoe UI";
    text-align: center;
    padding: 25px;
    margin: 25px;
    border: 1px solid #eee;
    background-color: #f8f9fa;
}
#btn, #edit {
  margin: 0 0 0 25px;
}

XML:

Code: Select all

<?xml version="1.0" encoding="UTF-8" ?>
<lcui-app>
  <resource type="text/css" src="example1.css"/>
  <ui>
    <textview id="text-hello" type="textview" class="text-hello">
      [i][color=#f00]Hello[/color][/i], [b][color=#fff][bgcolor=#f00]World![/bgcolor][/color][/b]
    </textview>
    <textedit id="edit">[i][color=#f00]Hello[/color][/i], [b][color=#fff][bgcolor=#f00]World![/bgcolor][/color][/b]</textedit>
    <button id="btn">Change</button>
  </ui>
</lcui-app>

small Include with main features. (It's example2)

Code: Select all

EnableExplicit


Macro MM
	"
EndMacro

Macro _getFunction(function)
	LCUI_#function=GetFunction(_lcuilib,MM#function#MM)
	If LCUI_#function=0
		MessageRequester("Fehler",MM#Methode '#function' konnte nicht geladen werden.MM,#PB_MessageRequester_Error)
		result=#False
	EndIf
EndMacro



Structure LCUI_Widget Align #PB_Structure_AlignC
	hash.u
	state.i
	id.s
	type.s
EndStructure

Structure LCUI_WidgetEvent Align #PB_Structure_AlignC
	type.i
	*data
	*target.LCUI_Widget
	cancel_bubble.u
EndStructure

Structure LCUI_Rect Align #PB_Structure_AlignC
	x.i
	y.i
	w.i
	h.i
EndStructure

Structure LCUI_MetricsRec Align #PB_Structure_AlignC
	dpi.f
	density.f
	scaled_density.f
	scale.f
EndStructure

Enumeration LCUI_DensityLevel
	#DENSITY_LEVEL_SMALL
	#DENSITY_LEVEL_NORMAL
	#DENSITY_LEVEL_LARGE
	#DENSITY_LEVEL_BIG
EndEnumeration

Global _lcuilib

PrototypeC ProtoLCUI_Init()
PrototypeC.i ProtoLCUI_Main()
PrototypeC.c ProtoLCUI_GetVersion()
PrototypeC ProtoLCUIWidget_GetRoot()
PrototypeC ProtoLCUIBuilder_LoadFile(pfad.p-ascii)
PrototypeC ProtoLCUIWidget_GetById(pfad.p-ascii)
PrototypeC ProtoWidget_Append(*root.LCUI_Widget,*pack.LCUI_Widget)
PrototypeC ProtoWidget_Unwrap(*pack.LCUI_Widget)
PrototypeC ProtoWidget_BindEvent(*pack.LCUI_Widget,eventname.p-ascii,*procedure,arg1,arg2)
PrototypeC ProtoTextEdit_GetTextW(*pack.LCUI_Widget,start,size,*data)
PrototypeC ProtoTextView_SetTextW(*pack.LCUI_Widget,*data)
PrototypeC ProtoWidget_UpdateStyle(*pack.LCUI_Widget,arg)
PrototypeC ProtoLCUIMetrics_SetDensityLevel(level.i);LCUI_DensityLevel
PrototypeC ProtoLCUIMetrics_SetScaledDensityLevel(level.i);LCUI_DensityLevel
PrototypeC ProtoLCUIMetrics_SetScale(scale.f)
PrototypeC ProtoLCUIMetrics_SetDpi(dpi.f)
PrototypeC ProtoLCUIWidget_RefreshStyle()
PrototypeC ProtoLCUIDisplay_InvalidateArea(*area.LCUI_Rect)
PrototypeC ProtoLCUI_GetMetrics()
PrototypeC ProtoLCUI_InitMetrics()

Global LCUI_LCUI_Init.ProtoLCUI_Init
Global LCUI_LCUI_Main.ProtoLCUI_Main
Global LCUI_LCUI_GetVersion.ProtoLCUI_GetVersion
Global LCUI_LCUIWidget_GetRoot.ProtoLCUIWidget_GetRoot
Global LCUI_LCUIBuilder_LoadFile.ProtoLCUIBuilder_LoadFile
Global LCUI_LCUIWidget_GetById.ProtoLCUIWidget_GetById
Global LCUI_Widget_Append.ProtoWidget_Append
Global LCUI_Widget_Unwrap.ProtoWidget_Unwrap
Global LCUI_Widget_BindEvent.ProtoWidget_BindEvent
Global LCUI_TextEdit_GetTextW.ProtoTextEdit_GetTextW
Global LCUI_TextView_SetTextW.ProtoTextView_SetTextW
Global LCUI_Widget_UpdateStyle.ProtoWidget_UpdateStyle
Global LCUI_LCUIMetrics_SetDensityLevel.ProtoLCUIMetrics_SetDensityLevel
Global LCUI_LCUIMetrics_SetScaledDensityLevel.ProtoLCUIMetrics_SetScaledDensityLevel
Global LCUI_LCUIMetrics_SetScale.ProtoLCUIMetrics_SetScale
Global LCUI_LCUIMetrics_SetDpi.ProtoLCUIMetrics_SetDpi
Global LCUI_LCUIWidget_RefreshStyle.ProtoLCUIWidget_RefreshStyle
Global LCUI_LCUIDisplay_InvalidateArea.ProtoLCUIDisplay_InvalidateArea
Global LCUI_LCUI_GetMetrics.ProtoLCUI_GetMetrics
Global LCUI_LCUI_InitMetrics.ProtoLCUI_InitMetrics

Procedure.b LCUI_Init()
	_lcuilib=OpenLibrary(#PB_Any,"LCUI.dll")
	Protected result.b=#False
	
	If _lcuilib
		result=#True
		_getFunction(LCUI_Init)
		_getFunction(LCUI_Main)
		_getFunction(LCUI_GetVersion)
		_getFunction(LCUIWidget_GetRoot)
		_getFunction(LCUIBuilder_LoadFile)
		_getFunction(LCUIWidget_GetById)
		_getFunction(Widget_Append)
		_getFunction(Widget_Unwrap)
		_getFunction(Widget_BindEvent)
		_getFunction(TextEdit_GetTextW)
		_getFunction(TextView_SetTextW)
		_getFunction(Widget_UpdateStyle)
		_getFunction(LCUIMetrics_SetDensityLevel)
		_getFunction(LCUIMetrics_SetScaledDensityLevel)
		_getFunction(LCUIMetrics_SetScale)
		_getFunction(LCUIMetrics_SetDpi)
		_getFunction(LCUIWidget_RefreshStyle)
		_getFunction(LCUIDisplay_InvalidateArea)
		_getFunction(LCUI_GetMetrics)
		_getFunction(LCUI_InitMetrics)
	Else
		MessageRequester("Fehler","LCUI.dll konnte nicht geladen werden",#PB_MessageRequester_Error)
	EndIf
	
	ProcedureReturn result
EndProcedure

Procedure LCUI_Close()
	If IsLibrary(_lcuilib)
		CloseLibrary(_lcuilib)
	EndIf
EndProcedure

CompilerIf #PB_Compiler_IsMainFile
	
	
	#EXAMPLE=3
	
	CompilerSelect #EXAMPLE
		CompilerCase 2
			Procedure OnBtnClick(*self.LCUI_Widget,*event.LCUI_WidgetEvent,*arg)
				Protected *edit.LCUI_Widget = LCUI_LCUIWidget_GetById("edit")
				Protected *txt.LCUI_Widget = LCUI_LCUIWidget_GetById("text-hello")
				Protected *str=AllocateMemory(255)
				
				LCUI_TextEdit_GetTextW(*edit, 0, 255, *str)
				LCUI_TextView_SetTextW(*txt, *str)			
			EndProcedure
		CompilerCase 3
			Enumeration _t
				#TYPE_DENSITY
				#TYPE_SCALED_DENSITY
				#TYPE_SCALE
				#TYPE_DPI
			EndEnumeration
			
			Structure _tdat
				type.i
				level.i
			EndStructure
			
			Procedure OnDebugClick(*self.LCUI_Widget,*event.LCUI_WidgetEvent,*arg)
				Protected *dat.LCUI_MetricsRec=LCUI_LCUI_GetMetrics()
				Debug *dat\dpi
				Debug *dat\density
				Debug *dat\scale
				Debug *dat\scaled_density
			EndProcedure
			
			Procedure OnButtonClick(*self.LCUI_Widget,*event.LCUI_WidgetEvent,*arg)
				Protected *dat._tdat=*event\data
				Select *dat\type
					Case #TYPE_DENSITY:
						LCUI_LCUIMetrics_SetDensityLevel(*dat\level)
						
					Case #TYPE_SCALED_DENSITY:
						LCUI_LCUIMetrics_SetScaledDensityLevel(*dat\level)
						
					Case #TYPE_SCALE:
						LCUI_LCUIMetrics_SetScale(*dat\level / 100.0)
						
					Case #TYPE_DPI:
						LCUI_LCUIMetrics_SetDpi(*dat\level )
						LCUI_LCUIMetrics_SetScale(*dat\level / 100.0)
				EndSelect
				LCUI_LCUIWidget_RefreshStyle()
				LCUI_LCUIDisplay_InvalidateArea(#Null)
			EndProcedure
			
			
			
			Procedure SetButton(id.s,type,level)
				
				Protected *btn.LCUI_Widget
				Protected *dat._tdat= AllocateStructure(_tdat)
				*dat\level=level
				*dat\type=type						
				*btn = LCUI_LCUIWidget_GetById(id)	
				LCUI_Widget_BindEvent(*btn, "click", @OnButtonClick(), *dat, #Null)
			EndProcedure
			
			Procedure InitButtons()
				SetButton("btn-density-small", #TYPE_DENSITY, #DENSITY_LEVEL_SMALL)
				SetButton("btn-density-normal", #TYPE_DENSITY, #DENSITY_LEVEL_NORMAL)
				SetButton("btn-density-large", #TYPE_DENSITY, #DENSITY_LEVEL_LARGE)	 
				SetButton("btn-density-big", #TYPE_DENSITY, #DENSITY_LEVEL_BIG)			 
				SetButton("btn-scaled-density-small", #TYPE_SCALED_DENSITY, #DENSITY_LEVEL_SMALL)
				SetButton("btn-scaled-density-normal", #TYPE_SCALED_DENSITY,#DENSITY_LEVEL_NORMAL)
				SetButton("btn-scaled-density-large", #TYPE_SCALED_DENSITY, #DENSITY_LEVEL_LARGE)
				SetButton("btn-scaled-density-big", #TYPE_SCALED_DENSITY,#DENSITY_LEVEL_BIG)
				SetButton("btn-scale-small", #TYPE_SCALE, 75)
				SetButton("btn-scale-normal", #TYPE_SCALE, 100)
				SetButton("btn-scale-large", #TYPE_SCALE, 150) 
				SetButton("btn-scale-big", #TYPE_SCALE, 200)	 
				SetButton("btn-dpi-small", #TYPE_DPI, 75)
				SetButton("btn-dpi-normal", #TYPE_DPI, 100)
				SetButton("btn-dpi-large", #TYPE_DPI, 150) 
				SetButton("btn-dpi-big", #TYPE_DPI, 200)	 
			EndProcedure
	CompilerEndSelect
	If LCUI_Init()
		LCUI_LCUI_Init()
		
		
		CompilerSelect #EXAMPLE
			CompilerCase 1
				Debug LCUI_LCUI_GetVersion()
			CompilerDefault
				CompilerSelect #EXAMPLE
					CompilerCase 2
						Define.LCUI_Widget *root, *pack, *btn
						*root = LCUI_LCUIWidget_GetRoot()
						*pack = LCUI_LCUIBuilder_LoadFile("example1\example1.xml")
						If Not *pack
							End
						EndIf
						
						LCUI_Widget_Append(*root, *pack)
						LCUI_Widget_Unwrap(*pack)
						*btn = LCUI_LCUIWidget_GetById("btn")
						LCUI_Widget_BindEvent(*btn, "click", @OnBtnClick(), #Null, #Null)
						
						LCUI_LCUI_Main()
					CompilerCase 3
						Define.LCUI_Widget *root, *pack, *btn
						*root = LCUI_LCUIWidget_GetRoot()
						*pack = LCUI_LCUIBuilder_LoadFile("example2\example2.xml")
						If Not *pack
							End
						EndIf
						LCUI_LCUI_InitMetrics()
						LCUI_Widget_UpdateStyle(*root, #True)
						LCUI_Widget_Append(*root, *pack)
						LCUI_Widget_Unwrap(*pack)
						InitButtons()
						*btn = LCUI_LCUIWidget_GetById("btn-dpi-debug")	
						LCUI_Widget_BindEvent(*btn, "click", @OnDebugClick(), #Null, #Null)
						LCUI_LCUI_Main()
				CompilerEndSelect
		CompilerEndSelect
		
		LCUI_Close()
	EndIf
CompilerEndIf
I will create a wrapper for PB to use the XML for DialogLibrary.
Justin
Enthusiast
Enthusiast
Posts: 725
Joined: Sat Apr 26, 2003 2:49 pm

Re: Users complain boring user interface of my apps

Post by Justin »

Webview2 control for windows here:
viewtopic.php?f=7&t=75898
Post Reply