GUI HTML Win32

@xman911 · Регистрация: 22.12.2012

Студворк — интернет-сервис помощи студентам

Собственно стоит такая задача:
программа Win32 App, MVS2012 и должно все это дело(окна) быть красивым, не в стиле 98-х... более того - окна/формы должны быть "нарисованы" html-ом.
Честно говоря, уверен был что найду кучу примеров и т.п. - но ничего толкового не нашел.
куда смотреть то? ткните носом плиз...

@Digit@ll · 21.01.2013, 19:09

Сообщение от xman911

окна/формы должны быть "нарисованы" html-ом.

Расшифруй.

@xman911 · 22.01.2013, 11:10 **[ТС]**

Расшифруй.

Необходимо чтобы сами окна были нарисованы html-oм. т.е. в хтмл я могу и фон поставить и кнопки круглые делать и окно произвольной формы. Все это благодаря скрещиванию html + c++.(т.е. насколько я понимаю, необходимо написать форму в html, затем как-то прикрутить файл к проекту MSVC++ и потом организовать интерфейс общения/обработки между ними) Я знаю что это возможно, и что многие программы именно так и устроены. но найти какой-нить рабочий пример, или описание пока не удалось.

Croessmah · 23.01.2013, 01:06

парсим html фаил и строим свой интерфейс, согласно полученной из файла структуры.

Сообщение от xman911

Я знаю что это возможно, и что многие программы именно так и устроены.

С xml знаю - делают и это очень удобно, кстати. Но с html ни разу не встречал.

@xman911 · 23.01.2013, 14:26 **[ТС]**

если создаешь проект mfc - там есть возможность указать(галочкой) - использовать html. и тогда сразу, по умолчанию создается диалоговое окно в хтмл, которое грузится при запуске программы. + пару кнопок и обработчик событий этих кнопок.

Так как у меня весь проект на WIN32, мне хотелось бы сделать то же самое только в нем.
Прикрутить хтмл форму в ресурсы, и показывать ее.
Вот как это сделать, чтобы не геморно было...
мне бы примерчик типа проект WIN32 + в ресурсах простая форма хтмл и пару кнопок, по клику которых вызывалась бы какая-то функция в с++

@-=ЮрА=- · 23.01.2013, 15:58

Писать такое на чистом API ИМХО самоубийство, вот скажем броузер на основе ACtiveX
https://www.cyberforum.ru/orde... ost3765815
там кода 10 строк и вот такой функционал как на скринах

Добавлено через 3 минуты

Не по теме:

Сообщение от xman911

ресурсах простая форма хтмл и пару кнопок, по клику которых вызывалась бы какая-то функция в с++

какая к чертям форма html. HTML это язык которым пишутся веб-странички, он содержит теги, каждый из которых подразумевает то или иное отображение их содержания. Все броузеры это считай рисовалки - они рисуют содержимое тегов. Нет простой формы HTML надо всё либо писать самому либо юзать готове коими являются ACtiveX элементы

Добавлено через 2 минуты

Не по теме:

PS:Есть производный класс на основе ACtiveX-а, который в моём броузере на скринах. Этот класс носит название CHtmlView - это представление SDI и к форме в понимании dialog based вообще никак неприкручивается, к форме он только через ActiveX пристыковывается!

@xman911 · 23.01.2013, 16:50 **[ТС]**

Сообщение от -=ЮрА=-

какая к чертям форма html.

да самая обычная... в html <form>...</form>
да собственно любая... вот,например этот код нарисует в броузере форму для заполнения:

HTML5
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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Форма ввода данныхm nk</title>
</head>
 
<body style="background-color: buttonface; font-family: Arial, Helvetica, sans-serif;
    font-size: small;">
    <table style="width: 440px; background-color:aqua;">
        <tr>
            <td style="width: 180px">
                Имя:<br />
                <input id="idName" type="text" maxlength="25" /><br />
                Фамилия:<br />
                <input id="idFamily" type="text" maxlength="25" /><br />
                Год рождения:<br />
                <input id="idYear" type="text" maxlength="12" /><br />
                Дом. адрес:<br />
                <input id="idAddr" type="text" maxlength="50" /><br />
            </td>
            <td>
                <select id="idWeekDay" style="width: 180px; margin-left: 10px;">
                    <option selected="selected" value="1">Январь</option>
                    <option value="2">Февраль</option>
                    <option value="3">Март</option>
                    <option value="4">Апрель</option>
                    <option value="5">Май</option>
                    <option value="6">Июнь</option>
                    <option value="7">Июль</option>
                    <option value="8">Август</option>
                    <option value="9">Сентябрь</option>
                    <option value="10">Октябрь</option>
                    <option value="11">Ноябрь</option>
                    <option value="12">Декабрь</option>                                        
                </select>
                <br />                
                <br />
                <input name="RadioGroup" id="Radio1" checked="checked" type="radio" style="width: 25px" title="Автоматически" />
                <label for="Radio1">Сохранять автоматически</label>
                <br />
                <input name="RadioGroup" id="Radio2" type="radio" style="width: 25px" title="Вручную" />
                <label for="Radio2">
                    Спрашивать подтверждение</label>&nbsp;<br />                    
                <br />
                <input id="Checkbox1" type="checkbox" style="width: 25px" checked="CHECKED" title="По умолчанию"
                    value="on" />
                    <label for="Checkbox1">Использовать по умолчанию</label>
                    <br />
            </td>
        </tr>
        <tr>
            <td colspan="2" style="text-align: center; height: 50px;">
                Для подтверждения данных нажмите кнопку "Ввод"</td>
        </tr>
        <tr>
            <td style="width: 180px">
            </td>
            <td>
                <input id="ButtonOK" type="button" value="Ввод" style="color: navy" />
                <input id="ButtonCancel" type="button" value="Отмена" style="color: navy" /></td>
        </tr>
    </table>
    <br />
    <br />
</body>
</html>

а потом есть куча кода, который рисует вместо обычного ВинАпи окна - вот эту, да еще обработка событий прикручена.

Броузер сделать можно на WindowsForms за 2-5 мин. ... но мне такое не нужно. мне нужно в WIN32.

Вот есть примерчик. Может кто поможет разобрать

@-=ЮрА=- · 23.01.2013, 17:07

Не по теме:

Сообщение от xman911

да самая обычная... в html <form>...</form>

- это текст html страницы с полем выбора а не форма. То что ты именуешь формой уже чертит сам броузер на основе кода тегов...

Добавлено через 47 секунд

Не по теме:

Ты разделом ошибся ИМХО тут пишут на С/С++ а не на HTML

Добавлено через 9 минут
xman911,HtmlControl.h :

C++
1
class HtmlControl : public CWindowImpl<HtmlControl>, public DWebBrowserEvents2

DWebBrowserEvents2 - вот и интерфейс, вот что и рисует теги в виде окна верней возвращает инфу от IWebBrowser(именно этот интерфейс рисует).
А вот та вся гора кода - бездарный бред...
DWebBrowserEvents2 http://msdn.microsoft.com/en-u... s.85).aspx
IWebBrowser2 http://msdn.microsoft.com/en-u... s.85).aspx
Кстати в моем приложении сверху именно IWebBrowser2.
Так что ещё раз - html-формы нет в природе! Есть интерфейсы и ActiveX на их основе, уж они то и создают отображение html кода в виде кнопок полей текста, таблиц и т.д.

@-=ЮрА=- · 23.01.2013, 17:31

Собственно содержимое HTML-я которое отображалось в броузере события в котором фиксировались DWebBrowserEvents2

Кликните здесь для просмотра всего текста

HTML5
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
<html>
<head>
<meta http-equiv="MSThemeCompatible" content="yes" />
<script src="JS/HtmlControl.js"></script>
<script>
// init window
external.SetTitle("html test");
external.Show(300, 200);    
</script>
<style>
body {
    padding: 0;
    margin: 0;
    vertical-align: bottom;
    border: 1px solid green;
}
div.resize-top {    
    position: absolute;     
    height: 2px; 
    width: 100%;    
    font-size: 0; 
    top: 0; 
    left: 0; 
    right: 0;
    z-index: 1; 
    cursor: s-resize;
}
div.resize-bottom {
    position: absolute;     
    height: 2px; 
    width: 100%;    
    font-size: 0; 
    bottom: 0; 
    left: 0; 
    right: 0;
    z-index: 1; 
    cursor: s-resize;
}
div.resize-left {
    position: absolute; 
    width: 2px; 
    height: 100%;
    font-size: 0; 
    top: 0; 
    left: 0; 
    bottom: 0;
    z-index: 1;
    cursor: e-resize;
}
div.resize-right {
    position: absolute; 
    width: 2px; 
    height: 100%;
    font-size: 0; 
    top: 0; 
    right: 0; 
    bottom: 0;
    z-index: 1;
    cursor: e-resize;
}
div.resize-top-left {
    position: absolute; 
    width: 10px;
    height: 10px; 
    font-size: 0; 
    top: 0;
    left: 0px;  
    z-index: 2;
    cursor: se-resize;
}
div.resize-top-right {
    position: absolute; 
    width: 10px;
    height: 10px; 
    font-size: 0; 
    top: 0;
    right: 0px; 
    z-index: 2;
    cursor: ne-resize;
}
div.resize-bottom-left {
    position: absolute; 
    width: 10px;
    height: 10px; 
    font-size: 1px; 
    bottom: 0;
    left: 0;
    z-index: 2;
    margin-left: 0px; 
    cursor: ne-resize;
}
div.resize-bottom-right {
    position: absolute; 
    width: 10px;
    height: 10px; 
    font-size: 1px; 
    bottom: 0;
    right: 0;
    z-index: 2;
    margin-left: 0px; 
    cursor: se-resize;
}
div.titlebar {
    height: 24px;
    z-index: 0;
    cursor: default;
    background: gray;
}
div.titlebar div.title {
    position: absolute;
    top: 6px;
    left: 20px; 
    color: white;
    font-family: verdana;
    font-size: 13px;
    font-weight: bold;
}
div.titlebar div.buttons {
    position: absolute;
    top: 6px;
    right: 10px;
}
div.titlebar div.buttons a {
    color: white;
    text-decoration: none;
    font-family: verdana;
    font-size: 11px;
    font-weight: bold;
    cursor: default;
}
div.titlebar div.buttons a:hover {
    color: red;
}
div.content {
    margin: 2px 4px 4px 4px;
    padding: 5px;   
    color: white;       
}
</style>
</head>
<body oncontextmenu="external.ShowContextMenu();return false;" 
      onselectstart="return false">
<div class="resize-top" onmousedown="external.ResizeWindow(HTTOP)"></div>
<div class="resize-bottom" onmousedown="external.ResizeWindow(HTBOTTOM)"></div>
<div class="resize-left" onmousedown="external.ResizeWindow(HTLEFT)"></div>
<div class="resize-right" onmousedown="external.ResizeWindow(HTRIGHT)"></div>
<div class="resize-top-left" onmousedown="external.ResizeWindow(HTTOPLEFT)"></div>
<div class="resize-top-right" onmousedown="external.ResizeWindow(HTTOPRIGHT)"></div>
<div class="resize-bottom-left" onmousedown="external.ResizeWindow(HTBOTTOMLEFT)"></div>
<div class="resize-bottom-right" onmousedown="external.ResizeWindow(HTBOTTOMRIGHT)"></div>
<div class="titlebar" onmousedown="external.DragWindow()">
    <div class="title">Title Bar</div>  
    <div class="buttons">
        <a href="javascript:external.MinimizeWindow()">_</a>
        <a href="javascript:external.ToggleMaximizeNormalWindow()">=</a>
        <a href="javascript:external.Close()">x</a>
    </div>
</div>
<div class="content">
    <button onclick="external.Close(0x1234)">exit</button>
    <button onclick="external.Foo()">foo</button>
    <br />
    <a href="http://google.com">google</a>
    <div id="dbg"></div>    
</div>
</body>
</html>
 
<script>
 
</script>

@-=ЮрА=- · 23.01.2013, 17:37

Вот html на базе поста 7.
Суть приложения html_control.zip - аттачим IWebBrowser2 и DWebBrowserEvents2 и уже им "слушаем" что делает юзер.
Теперь вопрос - что же мы хотим сотворить?

@xman911 · 23.01.2013, 19:39 **[ТС]**

А сотворить надо вот что:
у меня есть программа с АПИ-окнами, WndProcs-ами, thread-ами...
мне поставили теперь задачу чтобы все это было красивым, не "виндовым", а использовало для UI html... собственно на этом я и застрял(
короче надо чтобы красиво было... но сам код html-a писать буду не я... мне главное чтобы он потом работал, т.е. на данный момент заменить само окно, и его контролы картинками разными.. и чтобы сам функционал (события клика кнопок - не потерялся)

я не знаю как еще объяснить понятнее...

Добавлено через 1 час 18 минут
немного позже приду домой - покажу нагляднее что нужно переделать в моем проекте
Спасибо за участие!

@xman911 · 24.01.2013, 00:28 **[ТС]**

вот собственно мои окна... ничего сверхестественного... Вот мне нужно чтобы они были у меня отрисованы html-ом как в примере, который я привел ранее, а кнопки запускали такие же новые окна/формы.... вот и все... понемногу доходит как работает этот пример с html-control-ом, но пока не получается по клику на кнопку запустить еще одно такое окно... а также не понял как ловить сообщения, когда у меня будет несколько таких окон.

@xman911 · 24.01.2013, 12:43 **[ТС]**

кстати, пример довольно неплохой. учитывая что там обмен данными через функции JS. не нужно лезть в DOM (что я явно еще не умею)
Вот только не получается получить из функции строку.

JavaScript
1
2
3
4
5
function MyTestScript()
{
    var str="asdf";
    return str;
}

В с++ на бряке:

C++
1
2
3
4
5
6
7
8
9
10
const char* OnMyFoo(int argc, const char* argv[])
    {
        DISPPARAMS empty = {NULL, NULL, 0, 0};
        VARIANT retval;
        CallJS(L"MyTestScript", &empty, &retval);
        wchar_t d = retval.cVal; // или .bstrVal...короче пробовал разное но везде в представлении переменной 
//return - строки не читаются
        //MessageBox((&d),L"sdf",NULL);
        return "ok";
    }

@xman911 · 31.01.2013, 10:18 **[ТС]**

Вопрос остается актуальным, так как с примером тяжеловато разобраться:

Ищем легкий способ отображения и взаимодействия HTML-ной GUI в Win32-приложениях и чистым С++.

@xman911 · 01.02.2013, 12:02 **[ТС]**

Как же вернуть строку???

Новые блоги и статьи Все статьи Все блоги /
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Programma_Boinc 28.12.2025 Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / ********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / ********/ gallery/ bKBkQFf Пост отсюда. . .	Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США. Programma_Boinc 26.12.2025 Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .	Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .	PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .	Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .

@xman911 0 / 0 / 0 Регистрация: 22.12.2012 Сообщений: 68

	GUI HTML Win32 20.01.2013, 00:13. Показов 4371. Ответов 14 Метки нет (Все метки) Собственно стоит такая задача: программа Win32 App, MVS2012 и должно все это дело(окна) быть красивым, не в стиле 98-х... более того - окна/формы должны быть "нарисованы" html-ом. Честно говоря, уверен был что найду кучу примеров и т.п. - но ничего толкового не нашел. куда смотреть то? ткните носом плиз... 0

@xman911 0 / 0 / 0 Регистрация: 22.12.2012 Сообщений: 68
	23.01.2013, 14:26 [ТС]
	если создаешь проект mfc - там есть возможность указать(галочкой) - использовать html. и тогда сразу, по умолчанию создается диалоговое окно в хтмл, которое грузится при запуске программы. + пару кнопок и обработчик событий этих кнопок. Так как у меня весь проект на WIN32, мне хотелось бы сделать то же самое только в нем. Прикрутить хтмл форму в ресурсы, и показывать ее. Вот как это сделать, чтобы не геморно было... мне бы примерчик типа проект WIN32 + в ресурсах простая форма хтмл и пару кнопок, по клику которых вызывалась бы какая-то функция в с++ 0

@xman911 0 / 0 / 0 Регистрация: 22.12.2012 Сообщений: 68
	23.01.2013, 19:39 [ТС]
	А сотворить надо вот что: у меня есть программа с АПИ-окнами, WndProcs-ами, thread-ами... мне поставили теперь задачу чтобы все это было красивым, не "виндовым", а использовало для UI html... собственно на этом я и застрял( короче надо чтобы красиво было... но сам код html-a писать буду не я... мне главное чтобы он потом работал, т.е. на данный момент заменить само окно, и его контролы картинками разными.. и чтобы сам функционал (события клика кнопок - не потерялся) я не знаю как еще объяснить понятнее... Добавлено через 1 час 18 минут немного позже приду домой - покажу нагляднее что нужно переделать в моем проекте Спасибо за участие! 0

@xman911 0 / 0 / 0 Регистрация: 22.12.2012 Сообщений: 68
	31.01.2013, 10:18 [ТС]
	Вопрос остается актуальным, так как с примером тяжеловато разобраться: Ищем легкий способ отображения и взаимодействия HTML-ной GUI в Win32-приложениях и чистым С++. 0

@xman911 0 / 0 / 0 Регистрация: 22.12.2012 Сообщений: 68
	01.02.2013, 12:02 [ТС]
	Как же вернуть строку??? 0