purebasic.info

PureBasic forum
Текущее время: Пт дек 14, 2018 11:42 am

Часовой пояс: UTC + 3 часа




Начать новую тему Ответить на тему  [ Сообщений: 6 ] 
Автор Сообщение
 Заголовок сообщения: Коллекция CanvasGadget элементов GUI
СообщениеДобавлено: Вт мар 06, 2018 8:11 pm 
Не в сети
доцент

Зарегистрирован: Вс май 15, 2016 5:08 pm
Сообщений: 55
Благодарил (а): 1 раз.
Поблагодарили: 1 раз.
Пункты репутации: 0
Предлагаю собрать в этой теме все элементы пользовательского интерфейса, созданные на основе CanvasGadget-а.

В качестве примера, можно упомянуть известные многим вкладки "как в Опере" под именем TabBarGadget. Где-то на форуме была тема про скролл гаджет, так же организованный на канвасе, но пока я ее не нашел.

Зачем все это нужно?

Я сейчас пишу модуль, который позволяет кастомизировать окна как хочется, но пока упор идет на концепцию Flat Design (т.е. все квадратно-гнездовое, без теней и т.д.). Но естественно возникают сложности с созданием всех минимально необходимых элементов окна. В первую очередь это замена StringGadget-у. Код пока не выгладываю, ибо там не на что особо смотреть, да и до демонстрации там слишком мало возможностей. Пока реализованы смена цветовой модели окна, перетаскивание окна, задание хедера и футера (оно же статус бар), задание ширины рамки окна, одинокая кнопка с событием срабатывания.

Кстати, сразу же вопрос.

Перетаскивание окна организовано API-шной функцией:

Код:
1
2
3
4
5
6
7
 
event.l = WaitWindowEvent()
       
If event.l = #WM_LBUTTONDOWN
        SendMessage_(WindowID(GetActiveWindow()), #WM_NCLBUTTONDOWN, #HTCAPTION, 0)
EndIf
 



что ни разу не кроссплатформенно. Так что ищу как организовать последнее.

Ну и КДПВ

Вложение:
1.PNG [20.19 KiB]
Скачиваний: 0

_________________
Чат по PureBasic в Telegram


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Коллекция CanvasGadget элементов GUI
СообщениеДобавлено: Вт мар 06, 2018 10:08 pm 
Не в сети
профессор

Зарегистрирован: Сб фев 06, 2016 6:18 pm
Сообщений: 272
Благодарил (а): 14 раз.
Поблагодарили: 32 раз.
Пункты репутации: 0
:roll:
Код:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
#HTCAPTION = 2
#WM_NCHITTEST = 132
 
Procedure WinCallback(hWnd.i, uMsg.i, wParam.i, lParam.i)
  If uMsg = #WM_NCHITTEST
     ProcedureReturn #HTCAPTION
  EndIf
  ProcedureReturn #PB_ProcessPureBasicEvents
EndProcedure
 
OpenWindow(0, 0, 0, 100, 100, "", #PB_Window_BorderLess|1)
SetWindowCallback(@WinCallback())
Repeat
  Event.i = WaitWindowEvent()
Until Event = #PB_Event_CloseWindow
End


Опана, глянул в help а там Callback для Microsoft Windows. :?


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Коллекция CanvasGadget элементов GUI
СообщениеДобавлено: Пн мар 12, 2018 12:03 pm 
Не в сети
профессор

Зарегистрирован: Пт фев 20, 2009 12:57 pm
Сообщений: 1717
Откуда: Алматы
Благодарил (а): 16 раз.
Поблагодарили: 47 раз.
Пункты репутации: 5
понадобилось править циферки на подобии как хекс едитор делает. нет ли случаем готового канвасного гаджета на подобную тему?
Код:
1
2
00 01 02
03 04 05


типа мышкой выделил 02. вписал 08, а курсор сам съехал на 03 ячейку и предлагает вбить туда новое значение.


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Коллекция CanvasGadget элементов GUI
СообщениеДобавлено: Пн мар 12, 2018 2:38 pm 
Не в сети
профессор

Зарегистрирован: Пт фев 20, 2009 12:57 pm
Сообщений: 1717
Откуда: Алматы
Благодарил (а): 16 раз.
Поблагодарили: 47 раз.
Пункты репутации: 5
что-то типа такого. тыркать кнопку драв. потом мышкой по какому-то номеру. он типа в редактирование спрыгнет. надо видимо сразу делать полный селект этого числа, чтобы при вводе числа - сразу старое заместилось. но как потом отловить момент, что 2 символа введены и при вводе третьего - происходил прыжок на следующую ячейку?

Код:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
Enumeration
  #Window
  #PEEditorColorGadImg
  #PEEditorPalitraImg
  #PEEditorUpExportImg
  #ButTank
  #File
  #IcEdKisto4kaImg
  #IcEdZalivkaImg
  #IcEdCopyImg
  #IcEdPas
  #IcEdPasteWithPalImgteImg
  #IcEdPasteImg
  #IcEdPasteWithPalImg
  #IcEdOpenImg
  #SndErr
 
  #Grafic ; панель гаджет
 
  #GraficCont1
 
 
 
  #GraficCont2
 
  ;{ эти гаджеты в зачет
  #GHMatrixCanvas
  #GHLayerFrame
  #GHLayerOption1
  #GHLayerOption2
  #GHLayerOption3
 
  #GHHousesFrame
  #GHAtr
  #GHOrd
  #GHHrk
  #GHFrm
  #GHSrd
 
  #GHElementsList
  #GHConfigList
 
  #GHElementsListAdd
  #GHElementsListDel
 
  #GHConfigListAdd
  #GHConfigListDel
 
  ;{ выбор цвета 4 палитр
  #GHPal1Canv01
  #GHPal1Canv02
  #GHPal1Canv03
  #GHPal1Canv04
  #GHPal1Canv05
  #GHPal1Canv06
  #GHPal1Canv07
  #GHPal1Canv08
  #GHPal1Canv09
  #GHPal1Canv10
  #GHPal1Canv11
  #GHPal1Canv12
  #GHPal1Canv13
  #GHPal1Canv14
  #GHPal1Canv15
  ;}
  ;{
  #GHPal2Canv01
  #GHPal2Canv02
  #GHPal2Canv03
  #GHPal2Canv04
  #GHPal2Canv05
  #GHPal2Canv06
  #GHPal2Canv07
  #GHPal2Canv08
  #GHPal2Canv09
  #GHPal2Canv10
  #GHPal2Canv11
  #GHPal2Canv12
  #GHPal2Canv13
  #GHPal2Canv14
  #GHPal2Canv15
 
  #GHPal3Canv01
  #GHPal3Canv02
  #GHPal3Canv03
  #GHPal3Canv04
  #GHPal3Canv05
  #GHPal3Canv06
  #GHPal3Canv07
  #GHPal3Canv08
  #GHPal3Canv09
  #GHPal3Canv10
  #GHPal3Canv11
  #GHPal3Canv12
  #GHPal3Canv13
  #GHPal3Canv14
  #GHPal3Canv15
 
  #GHPal4Canv01
  #GHPal4Canv02
  #GHPal4Canv03
  #GHPal4Canv04
  #GHPal4Canv05
  #GHPal4Canv06
  #GHPal4Canv07
  #GHPal4Canv08
  #GHPal4Canv09
  #GHPal4Canv10
  #GHPal4Canv11
  #GHPal4Canv12
  #GHPal4Canv13
  #GHPal4Canv14
  #GHPal4Canv15
  ;}
 
  #WindowMHHAddElem
  #MHHAddElemNames
  #MHHAddElemFilePath
  #MHHAddElemFilePathOpen
  #MHHAddElemWidth
  #MHHAddElemHeight
  #MHHAddElemMatrixList
  #MHHAddElemMatrixSave
  #MHHAddElemDraw
  #MHHAddElemFont
  #MHHAddElemMatrixCanvas
  #MHHAddElemMatrixImg
  #MHHAddElemMatrixImg2
  #MHHAddElemMatrixEdit
  #MHHAddElemMatrixEditL
  #MHHAddElemMatrixEditR
  ;}
 
  #GraficHrkGad
  #GraficAtrGad
  #GraficOrdGad
  #GraficFrmGad
  #GraficSrdGad
 
EndEnumeration
 
 
Structure matrarry
  Array y.a(0)
EndStructure
 
Structure matrarr
  filename$
  width.a
  height.a
  Array x.matrarry(0)
EndStructure
 
Global Dim MHHMatrixArray.matrarr(0)
 
Procedure MHHFillMatrixArray(width.a, height.a)
 
  sz = ArraySize(MHHMatrixArray()) + 1
  ReDim MHHMatrixArray(sz)
 
  MHHMatrixArray(sz)\width  = width
  MHHMatrixArray(sz)\height = height
 
  ReDim MHHMatrixArray(sz)\x(width)
 
  For x = 0 To width
    ReDim MHHMatrixArray(sz)\x(x)\y(height)
  Next
 
  tylenum = 1  
  For y = 0 To height-1
    For x = 0 To width-1                  
      MHHMatrixArray(sz)\x(x)\y(y) = tylenum
      tylenum + 1
    Next
   
  Next
 
EndProcedure
 
Procedure MHHAddElementWindow()
 
  DisableWindow(#Window, 1)
 
  LoadFont(#MHHAddElemFont, "Arial", 5)
 
  If OpenWindow(#WindowMHHAddElem, 100, 200, 500, 300, "Element", #PB_Window_SystemMenu | #PB_Window_MinimizeGadget | #PB_Window_ScreenCentered, WindowID(#Window))
    TextGadget(#MHHAddElemNames, 30, 10, 400, 20, "matrix                width          height                                              gfx file")
    y = 30
    ComboBoxGadget(#MHHAddElemMatrixList, 10, y, 70, 20)
    AddGadgetItem(#MHHAddElemMatrixList, 0, "new")
    SetGadgetState(#MHHAddElemMatrixList, 0)
   
    StringGadget(#MHHAddElemWidth, 90, y, 50, 20, "12")
    StringGadget(#MHHAddElemHeight, 150, y, 50, 20, "12")
   
    ButtonGadget(#MHHAddElemDraw, 210, y, 50, 20, "draw")
   
   
   
    StringGadget(#MHHAddElemFilePath, 280, y, 120, 20, "", #PB_String_ReadOnly)
    ButtonGadget(#MHHAddElemFilePathOpen, 400, y, 50, 20, "open")
   
    ;ButtonGadget(#MHHAddElemMatrixSave, 395, y, 70, 20, "save matrix")
   
    StringGadget(#MHHAddElemMatrixEdit, 50, 250, 50, 20, "")
    SetGadgetAttribute(#MHHAddElemMatrixEdit, #PB_String_MaximumLength, 2)
   
    ButtonGadget(#MHHAddElemMatrixEditL, 30, 250, 20, 20, "<")
    ButtonGadget(#MHHAddElemMatrixEditR, 100, 250, 20, 20, ">")
 
   
    Repeat
      Event = WaitWindowEvent()
   
      Select Event
        Case #PB_Event_Gadget
          EvGadget = EventGadget()
          Select EvGadget
            Case #MHHAddElemFilePathOpen ; обзор
              file$ = OpenFileRequester("Load gfx file file", "", "(*.bin)|*.bin", 1)
              If file$
                SetGadgetText(#MHHAddElemFilePath, file$)
              EndIf
             
            Case #MHHAddElemDraw
              height = Val(GetGadgetText(#MHHAddElemHeight))
              width = Val(GetGadgetText(#MHHAddElemWidth))
              If width And height
               
                MHHFillMatrixArray(width, height)
 
                CanvasGadget(#MHHAddElemMatrixCanvas, 10, 60, width * 12 - 1, height * 12 - 1)
               
                sz = ArraySize(MHHMatrixArray())
                If IsImage(#MHHAddElemMatrixImg)
                  FreeImage(#MHHAddElemMatrixImg)
                EndIf
                If CreateImage(#MHHAddElemMatrixImg, width * 12 - 1, height * 12 - 1)
                  If StartDrawing(ImageOutput(#MHHAddElemMatrixImg))
                    Box(0, 0, width * 12 - 1, height * 12 - 1, 0)
                    DrawingFont(FontID(#MHHAddElemFont))
                    For y = 0 To height
                      For x = 0 To width                  
                        DrawText(x*12+1, y*12+1, RSet(Hex(  MHHMatrixArray(sz)\x(x)\y(y)  ), 2, "0"))
                        tylenum + 1
                      Next
                    Next
                    StopDrawing()
                   
                    If IsImage(#MHHAddElemMatrixImg2)
                      FreeImage(#MHHAddElemMatrixImg2)
                    EndIf
                    CopyImage(#MHHAddElemMatrixImg, #MHHAddElemMatrixImg2)
                   
                    SetGadgetAttribute(#MHHAddElemMatrixCanvas, #PB_Canvas_Image, ImageID(#MHHAddElemMatrixImg))
                   
                  EndIf
                 
                EndIf
               
               
              EndIf
             
            Case #MHHAddElemMatrixCanvas
              MHHMatrixCoordX = GetGadgetAttribute(#MHHAddElemMatrixCanvas, #PB_Canvas_MouseX)
              MHHMatrixCoordY = GetGadgetAttribute(#MHHAddElemMatrixCanvas, #PB_Canvas_MouseY)
              Select EventType()
                Case #PB_EventType_MouseMove
                  MHHMatrixCoordX / 12 * 12
                  MHHMatrixCoordY / 12 * 12
                  If MHHMatrixCoordX <> oldMHHMatrixCoordX Or MHHMatrixCoordY <> oldMHHMatrixCoordY
                    oldMHHMatrixCoordX = MHHMatrixCoordX
                    oldMHHMatrixCoordY = MHHMatrixCoordY
                   
                    If StartDrawing(CanvasOutput(#MHHAddElemMatrixCanvas))
                      DrawImage(ImageID(#MHHAddElemMatrixImg), 0, 0)
                      Line(oldMHHMatrixCoordX, oldMHHMatrixCoordY, 10, 1)
                      Line(oldMHHMatrixCoordX, oldMHHMatrixCoordY, 1, 10)
                      Line(oldMHHMatrixCoordX+10, oldMHHMatrixCoordY, 1, 10)
                      Line(oldMHHMatrixCoordX, oldMHHMatrixCoordY+10, 10, 1)
                      StopDrawing()
                    EndIf
                   
                  EndIf
                 
                Case #PB_EventType_LeftButtonUp
                  MHHSelX = MHHMatrixCoordX / 12
                  MHHSelY = MHHMatrixCoordY / 12
                  tmp = MHHMatrixArray(sz)\x(MHHSelX)\y(MHHSelY)
                  SetGadgetText(#MHHAddElemMatrixEdit, RSet(Hex(tmp), 2, "0"))
                  SetActiveGadget(#MHHAddElemMatrixEdit)
                  SendMessage_(GadgetID(#MHHAddElemMatrixEdit), #EM_SETSEL, 0, -1)
                 
                  oldMHHMatrixCoordX = MHHMatrixCoordX / 12 * 12
                  oldMHHMatrixCoordY = MHHMatrixCoordY / 12 * 12
                 
                  If StartDrawing(ImageOutput(#MHHAddElemMatrixImg))
                    DrawImage(ImageID(#MHHAddElemMatrixImg2), 0, 0)
                   
                    Line(oldMHHMatrixCoordX, oldMHHMatrixCoordY, 10, 1, RGB(0, 200, 0))
                    Line(oldMHHMatrixCoordX, oldMHHMatrixCoordY, 1, 10, RGB(0, 200, 0))
                    Line(oldMHHMatrixCoordX+10, oldMHHMatrixCoordY, 1, 10, RGB(0, 200, 0))
                    Line(oldMHHMatrixCoordX, oldMHHMatrixCoordY+10, 10, 1, RGB(0, 200, 0))
                   
                    StopDrawing()
                   
                    SetGadgetAttribute(#MHHAddElemMatrixCanvas, #PB_Canvas_Image, ImageID(#MHHAddElemMatrixImg))
                   
                  EndIf
                 
              EndSelect
             
            Case #MHHAddElemMatrixEditR
              MHHSelX + 1
              tmp = MHHMatrixArray(sz)\x(MHHSelX)\y(MHHSelY)
              SetGadgetText(#MHHAddElemMatrixEdit, RSet(Hex(tmp), 2, "0"))
              SetActiveGadget(#MHHAddElemMatrixEdit)
              SendMessage_(GadgetID(#MHHAddElemMatrixEdit), #EM_SETSEL, 0, -1)
             
              oldMHHMatrixCoordX = MHHSelX * 12
              oldMHHMatrixCoordY = MHHSelY * 12
             
              If StartDrawing(ImageOutput(#MHHAddElemMatrixImg))
                    DrawImage(ImageID(#MHHAddElemMatrixImg2), 0, 0)
                   
                    Line(oldMHHMatrixCoordX, oldMHHMatrixCoordY, 10, 1, RGB(0, 200, 0))
                    Line(oldMHHMatrixCoordX, oldMHHMatrixCoordY, 1, 10, RGB(0, 200, 0))
                    Line(oldMHHMatrixCoordX+10, oldMHHMatrixCoordY, 1, 10, RGB(0, 200, 0))
                    Line(oldMHHMatrixCoordX, oldMHHMatrixCoordY+10, 10, 1, RGB(0, 200, 0))
                   
                    StopDrawing()
                   
                    SetGadgetAttribute(#MHHAddElemMatrixCanvas, #PB_Canvas_Image, ImageID(#MHHAddElemMatrixImg))
                   
              EndIf
             
             
          EndSelect
         
        Case #PB_Event_CloseWindow
          ElementQuit = 1
          CloseWindow(#WindowMHHAddElem)
 
      EndSelect
     
    Until ElementQuit = 1  
   
  EndIf
 
  DisableWindow(#Window, 0)
  SetActiveWindow(#Window)
  UseGadgetList(WindowID(#Window))
 
EndProcedure
 
If OpenWindow(#Window, 100, 200, 10, 10, "", #PB_Window_SystemMenu | #PB_Window_MinimizeGadget | #PB_Window_ScreenCentered)
 
  MHHAddElementWindow()
 
EndIf




я уже который раз проклинаю этот свой редактор :))))) сам не рад что связался...

добавил селект текста. и тем не менее как отловить момент, что 2 символа введены, при вводе третьего - производить переключение на следующую ячейку? и я думаю сразу надо 1 символ в новой ячейке заменить на то значение, что вводится 3 числом. сумбурно как-то объясняю :)


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Коллекция CanvasGadget элементов GUI
СообщениеДобавлено: Вт мар 13, 2018 1:27 pm 
Не в сети
МОДЕРАТОР
Аватар пользователя

Зарегистрирован: Пн апр 09, 2007 4:53 pm
Сообщений: 11336
Благодарил (а): 4 раз.
Поблагодарили: 443 раз.
Помню давно я подобное делал в этой проге в EditorGadget.

_________________
Компьютер позволяет решать все те проблемы, которые до его изобретения не существовали. :) :)


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Коллекция CanvasGadget элементов GUI
СообщениеДобавлено: Вт мар 13, 2018 3:13 pm 
Не в сети
профессор

Зарегистрирован: Пт фев 20, 2009 12:57 pm
Сообщений: 1717
Откуда: Алматы
Благодарил (а): 16 раз.
Поблагодарили: 47 раз.
Пункты репутации: 5
а я сделал так - событие change - и при каждом ченже проверяю количество символов в гаджете - если 2, делаю прыг на следующую ячейку. правда не привычно... очень уж ломает шаблон в голове, что когда ты в стринг гаджете что-то пишешь, то это в стринг гаджете и остается. а тут пишешь скажем 01, поднимаешь глаза посмотреть что ты там вбил - а там какая-нить 83 - думаешь чо за фигня, я же 01 писал :) как-то не сраду дотумкиваешь, что это уже следующая ячейка. еще добавил оптионы на выбор направления куда прыгать - вправо или вниз. вобщем доволен :) правда еще надо подумать над размером изображения... на более высоком разрешении экрана там ж ничерта не будет видно. на 1024х768 уже мелковато, а если там какие две на полторы тыщи - там наверное вообще ничерта видно не будет :)

остается надеяться что редактирование шаблонов графики моим пользователям не поднадобится. а базовые я сам вобью.


Вернуться наверх
 Профиль  
 
Показать сообщения за:  Сортировать по:  
Начать новую тему Ответить на тему  [ Сообщений: 6 ] 

Часовой пояс: UTC + 3 часа


Кто сейчас на форуме

Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 5


Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете добавлять вложения

Найти:
Перейти:  
Создано на основе phpBB® Forum Software © phpBB Group (блог о phpBB)
Сборка создана CMSart Studio
Русская поддержка phpBB