Page 1 of 1

Windows 10 Setup Window like Buttons using BtnBmp

Posted: Wed Feb 14, 2018 8:50 am
by nageswaragunupudi
This screen is very familiar to all users of Windows 10.

Image

These buttons are created using BtnBmp. The buttons are rearranged when the window is resized. On a smaller window, they look like this.

Image

Buttons change like this on still narrower screen.

Image

\fwh\samples\w10btns.prg (FWH1801)

Code: Select all

#include "fivewin.ch"

#define LAYOUT_TOP     1
#define LAYOUT_LEFT    2

//----------------------------------------------------------------------------//

function Main()

   local oWnd, oBtn
   local oFont, oBold, oFont1, oFontG
   local oSay
   local oGet
   local cFind      := ""
   local cPrompt    := "Setup of Windows ( FWH BtnBmp Demo )"
   local nRow       := 170
   local nCol       := 180
   local nClrBack   := CLR_WHITE
   local nW         := 200
   local nH         := 140
   local nCBorder   := 0xC38B2B
   local nClrText   := CLR_BLACK
   local nClrBorder := 0xE6E6E6
   local x
   local aBtns    := { ;
                      { "System" + CRLF + "Screen, notifications," + CRLF + "power", 0xE770, { || Dummy() } }, ;
                      { "Devices" + CRLF + "Bluetooth, printers," + CRLF + "mouse", 0xE772, { || Dummy() } }, ;
                      { "Mobile" + CRLF + "Link your Android, iPhone" + CRLF, 0xE1C9, { || Dummy() } }, ;
                      { "Network && Internet" + CRLF + "WIFI, flight mode" + CRLF + "VPN", 0xE12b, { || Dummy() } }, ;
                      { "Personalization" + CRLF + "Background, lock screen" + CRLF, 0xE771, { || Dummy() } }, ;
                      { "Apps" + CRLF + "Uninstall defaults" + CRLF + "Optional Features", 0xE179, { || Dummy() } }, ;
                      { "Account" + CRLF + "Your account, email sync" + CRLF + "Work family", 0xE77B, { || Dummy() } }, ;
                      { "Time and language" + CRLF + "Voice, region, date" + CRLF, 0xE775, { || Dummy() } }, ;
                      { "Games" + CRLF + "Game bar, DVR," + CRLF + "retransmission and game mode", 0xE909, { || Dummy() } }, ;
                      { "Accessibility" + CRLF + "Narrator, magnifying glass," + CRLF + "high contrast", 0xE776, { || Dummy() } }, ;
                      { "Cortana" + CRLF + "Language of Cortana," + CRLF + "permissions, notifications", 0xECCA, { || Dummy() } }, ;
                      { "Privacy" + CRLF + "Location Camera" + CRLF, 0xE1F6, { || Dummy() } }, ;
                      { "Update && Security" + CRLF + "Windows Update" + CRLF + "Recovery", 0xE777, { || Dummy() } } ;
                     }

   DEFINE FONT oFont  NAME "Segoe UI" SIZE 0,-14
   DEFINE FONT oFontG NAME "Segoe UI" SIZE 0,-18
   DEFINE FONT oBold  NAME "Segoe UI" SIZE 0,-14 BOLD
   DEFINE FONT oFont1 NAME "Segoe UI Light" SIZE 0,-24

   DEFINE WINDOW oWnd TITLE "Setup"
   oWnd:SetFont( oFont )

   @ 20, 490 SAY oSay PROMPT cPrompt OF oWnd PIXEL FONT oFont1 SIZE 420, 40
   @ 70, 500 GET oGet VAR    cFind   OF oWnd PIXEL FONT oFontG SIZE 400, 36 ;
      CUEBANNER "Find a setting"
   WITH OBJECT oGet
      :bAction       := { || Dummy() }
      :cBmpName      := 0xE11A
      :lBtnTransparent  := .t.
      :CreateButton()
   END

   For x = 1 to Len( aBtns )
      if x > 1
         if Mod( x, 5 ) = 1
            nRow += 200
            nCol := 180
         else
            nCol += 200
         endif
      endif
      @ nRow, nCol BTNBMP oBtn PROMPT aBtns[ x ][ 1 ]  ;
         RESOURCE aBtns[ x ][ 2 ] SIZE nW, nH PIXEL OF oWnd FLAT NOBORDER ;
         COLOR nClrText, nClrBack
         WITH OBJECT oBtn
            :bAction     := aBtns[ x ][ 3 ]
            :nClrBorder  := nClrBorder
            :bColorMap   := { | o | o:lBorder := o:lMOver, nCBorder }
            :oFontBold   := oBold
            :lRound      := .F.
         END
   Next x

   oWnd:nWidth    := 850
   oWnd:nHeight   := 800

   ACTIVATE WINDOW oWnd MAXIMIZED ON RESIZE WndResize( oWnd )
   RELEASE FONT oFont, oBold, oFont1, oFontG

return nil

//----------------------------------------------------------------------------//

static function Dummy()
Return nil

//----------------------------------------------------------------------------//

static function WndResize( oWnd )

   local oRect    := oWnd:GetCliRect()
   local nMargin, nRow, nCol, nCols, nBtnWidth, nBtns, nBtn, oBtn, n

   for n := 1 to 2
      oWnd:aControls[ n ]:nLeft := ( oRect:nWidth - oWnd:aControls[ n ]:nWidth ) / 2
   next

   nBtnWidth   := 200
   nCols       := Min( 5, Int( oRect:nWidth / nBtnWidth ) - 1 )
   nMargin     := ( oRect:nWidth - nCols * nBtnWidth ) / 2

   nBtns       := Len( oWnd:aControls ) - 2

   nRow        := 170
   nCol        := nMargin

   if nCols > 2
      for nBtn := 1 to nBtns
         WITH OBJECT ( oBtn := oWnd:aControls[ nBtn + 2 ] )
            :cCaption  := Trim( oBtn:cCaption )
            :nTop      := nRow
            :nLeft     := nCol
            :nWidth    := 200
            :nHeight   := 140
            :nLayOut   := LAYOUT_TOP
         END
         if nBtn % nCols == 0
            nRow  += 200
            nCol  := nMargin
         else
            nCol  += nBtnWidth
         endif
      next
   else
      for nBtn := 1 to nBtns
         WITH OBJECT ( oBtn := oWnd:aControls[ nBtn + 2 ] )
            :cCaption  += " "
            :nTop      := nRow
            :nLeft     := 30
            :nWidth    := oRect:nWidth - 60
            :nHeight   := 80
            :nLayOut   := LAYOUT_LEFT
         END
         nRow  += 100
      next
   endif

return nil

//----------------------------------------------------------------------------//
 

Re: Windows 10 Setup Window like Buttons using BtnBmp

Posted: Wed Feb 14, 2018 10:22 am
by Antonio Linares
Feature included in FWH 18.01 to be published today :-D

Re: Windows 10 Setup Window like Buttons using BtnBmp

Posted: Sat Feb 17, 2018 5:57 pm
by Silvio.Falconi
How Know all unicode symbols ... it can be good for make a win10 release for my app

Re: Windows 10 Setup Window like Buttons using BtnBmp

Posted: Sat Feb 17, 2018 6:03 pm
by nageswaragunupudi
Fwh/samples/uisymbol. Prg

Re: Windows 10 Setup Window like Buttons using BtnBmp

Posted: Sat Feb 17, 2018 6:14 pm
by Silvio.Falconi
thanks

Re: Windows 10 Setup Window like Buttons using BtnBmp

Posted: Wed May 22, 2019 8:07 pm
by Otto
Dear Mr. Rao,
how can we activate vertical scrollbar.

Thank you in advance
Otto

Re: Windows 10 Setup Window like Buttons using BtnBmp

Posted: Thu May 23, 2019 7:23 am
by Silvio.Falconi
scrolpanel

Re: Windows 10 Setup Window like Buttons using BtnBmp

Posted: Thu May 23, 2019 8:18 am
by Otto
Silvio, thank you. Is there a sample.
Best regards
Otto

Re: Windows 10 Setup Window like Buttons using BtnBmp

Posted: Thu May 23, 2019 8:44 am
by Silvio.Falconi

Code: Select all


Function test()
     Local oPanel,oBrush,oWnd
     Local cTitle
   cTitle:="Title"
DEFINE DIALOG oWnd SIZE 420,420 PIXEL
ACTIVATE DIALOG oWnd  CENTERED       ;
ON INIT ( oPanel := CreaPanelscroll( oWnd) )
 Return return 

Function CreaPanelscroll( oWnd) 
Local oPanel
local n
Local nRow:= 1
Local nCol:= 1
 oPanel:= TScrollPanel():New(1,1,oWnd:nbottom-10,oWnd:nWidth-10,oWnd, .t.)

for n= 1 to 3

 @ nRow, ncol BTNBMP oBtn[n] ....of oPanel

next
 oPanel:checkresize()
      oPanel:SetRange()
return oPanel