неправильно отображается html в mfc - Продукты TerraInformatica

Пробую разобраться с htmlayout.
Студия VS2008, созmдаю пустой mfc проект на основе окна диалога.
модифицирую WindowProc:

LRESULT CRrrDlg::WindowProc(UINT message, WPARAM wParam, LPARAM lParam)
{
    // TODO: добавьте специализированный код или вызов базового класса
    LRESULT lResult;
    BOOL    bHandled;

    lResult = HTMLayoutProcND(m_hWnd,message,wParam,lParam, &bHandled);
    if(bHandled)      //если флаг handled установлен в TRUE
        return lResult; //значит вся необходимая обработка уже выполнена

    return CDialog::WindowProc(message, wParam, lParam);
}

Пишу в OnInitDialog:

    ::HTMLayoutLoadFile(this->m_hWnd, L"D:\\My Projects\\Rrr\\index.html");

Вот текст того, что хочу отобразить.
index.html:

<html>
<head>
<style>
    @import url(style.css);
</style>
</head>
<body>
   <div .tabs>
      <div .strip> <!-- our tab strip, can be placed on any side of tab container. -->
         <div panel="panel-id1" selected>Игроки</div>
         <div panel="panel-id2">Информация</div>
         <div panel="panel-id3">Настройки</div>
      </div>
      <div name="panel-id1" selected>
          <table id="players" fixedrows=1 fixedlayout>
              <tr .header> <td>Код</td><td>Уровень</td><td>Имя</td><td>Клан</td><td>Здоровье</td><td>Выносливость</td><td>Описание</td></tr>
          </table>
          <button type="checkbox" id="ShowAllPlayers" class="settings" > Отобразить всех игроков</button>
      </div>
      <div name="panel-id2" >
          <table class="gridinfo">
          <tr> <th colspan="2"><h3>Персонаж</h3></th></tr>
          <tr> <td>Ник</td><td><span id="nick"><font color="red">N/A</font></span></td></tr>
          <tr> <td>Здоровье</td><td><span id="heal"><font color="red">N/A</font></span></td></tr>
          <tr> <td>Выносливость</td><td><span id="stamina"><font color="red">N/A</font></span></td></tr>
          <tr> <td>Оружие</td><td><span id="weapon"><font color="red">N/A</font></span></td></tr>
          <tr> <td>Обойма</td><td><span id="obojma"><font color="red">N/A</font></span></td></tr>
          <tr> <td>&nbsp;</td><td><button id="btnInventory" >Отчет об имуществе</button></span></td></tr>
          <tr> <th colspan="2"><h3>Соединение</h3></th></tr>
              <tr>
                <td>Сервер: <span id="status-serv"><font color="red">N/A</font></span></td>
                <td>Клиент: <span id="status-clie"><font color="red">N/A</font></span></td>
              </tr>
              <tr>
                <td>Получено: <span id="txtSendedServ"><font color="red">N/A</font></span></td>
                <td>Отправлено: <span id="txtSendedClie"><font color="red">N/A</font></span></td>
              </tr>
          </table>
      </div>
      <div name="panel-id3" >
        <h3>Настройки автокача</h3>
        <input type="hslider" id="Heal" buddy="Heal-value" class="settings"/> Порог уровня жизни = <b id="Heal-value"> </b>%<br />
        <input type="hslider" id="Stamina" buddy="Stamina-value" class="settings"/> Порог уровня выносливости = <b id="Stamina-value"> </b>%<br />
        <h3>Настройки программы</h3>
        <button id="MuteSound" class="settings" type="checkbox"> Отключить звуки</button><br />
        <button id="MinOnClose" class="settings" type="checkbox"> Свернуть при закрытии</button><br />
        <button id="AlwaysOnTop" class="settings" type="checkbox"> Окно всегда сверху</button><br />
            Путь к ресурсам игры(к каталогу с файлом main.swf)<br />
        <input id="PathToRes" type="text" class="settings" size="60" />&nbsp;<button id="btnSelectPath">...</button><br />
        <font color=purple>Внимание! Настройки применяются сразу после изменения!</font>
      </div>      
   </div>
  </div>

  
  <menu.popup id="row-menu">
      <li id="i1">First item</li>
      <li id="i2">Second item</li>
      <li id="i3">Third item</li>
      <li id="i4">Fourth item</li>
  </menu>
</body>
</html>

style.css:

html { 
    width:100%; 
    height:100%; 
    font: 10pt "Arial","Century Gothic","Tahoma";
}
body 
{ 
  width:100%; height:100%; 
  padding:0;
  margin:0;
}


      table#players 
      { 
        behavior:grid column-resizer;
        overflow:auto;
        width:100%%;
        height:100%%;
        border-spacing:0;
        background-color:white;
        border:1px solid silver;
      }
      table#players td { white-space:nowrap; padding:2px 3px; border:1px solid; border-color: transparent silver silver transparent;
                         width:400px; }
      table#players tr.header { background-color:silver silver black black; color:white;  }
      table#players tr.header td { border-color: silver black black silver; foreground-position:100% 50%; foreground-repeat:no-repeat;}
      table#players tr.header td:hover { border-bottom-color: orange; }
      table#players td:nth-child(1) { min-width:0px; width:18px;}
      table#players td:nth-child(2) { min-width:0px; width:30px; }
      table#players td:nth-child(3) { min-width:0px; width:130px; }
      table#players td:nth-child(4) { min-width:0px; width:130px; }
      table#players td:nth-child(5) { min-width:0px; width:60px; }
      table#players td:nth-child(6) { min-width:0px; width:60px; }
      table#players td:nth-child(7) { min-width:0px; width:130px; }
      tr:current { color:blue; 
        background-color: yellow; }
     
      /* behavioral styles */
      
      /* sort column on header cell click: */
      tr.header > td
      {
        active-on! :
          self.parent().$1( td[sorted] ).sorted = null,   // remove @sorted from previous td of the row, if any
          self.sorted = "asc",                            // set @sorted="asc" on this element
          ncolumn = self:index,                           // store ncolumn for future use in the comparator
          is_less = @(row1, row2)                      // comparator function per se
            row1.child(ncolumn):value.toLower() < row2.child(ncolumn):value.toLower() ? true #
            row1.child(ncolumn):value.toLower() > row2.child(ncolumn):value.toLower() ? false #
            row1:index < row2:index,
          self.$1p(table).$(tr:not(.header)).sort(is_less);      // do the sort.
      }
      tr.header > td[sorted="asc"]
      {
        foreground-image: url(stock:arrow-down);
        
        active-on! :
          self.sorted = "desc",
          ncolumn = self:index,
          is_less = @(row1, row2) 
            row2.child(ncolumn):value.toLower() < row1.child(ncolumn):value.toLower() ? true #
            row2.child(ncolumn):value.toLower() > row1.child(ncolumn):value.toLower() ? false #
            row1:index < row2:index,
          self.$1p(table).$(tr:not(.header)).sort(is_less);
      }
      tr.header > td[sorted="desc"]
      {
        foreground-image: url(stock:arrow-up);      
      }
table.gridinfo
{
    width:100%;
    border:none;
}

table.gridinfo > tr > th
{
    width:50%;
}

.tabs 
{
  font:system;
  behavior:tabs;
  height:*;
  width:*;
  overflow:hidden;
}

.tabs > .strip /* the tab strip */
{
  flow: horizontal;
  width:*;
  padding: 4px 10px 0 10px;
  background-color: window window threedface threedface;
  border-bottom:1px solid threedshadow;  
}

.tabs > .strip > [panel] /* the tab having panel attribute, passive by default */
{
  padding: 3px 8px;
  height: *; /* span the whole row */
  max-width: auto; /* not wider than max-intrinsic  */
  background-color: lavender;
  border-radius: 12px 12px 0 0;
  border-style:solid;
  border-color:threedshadow;
  border-width:1px 1px 0 1px;
  margin:0 -1px;
  cursor:pointer;
}

.tabs > .strip > [panel]:hover /* passive tab */
{
  border-top-color: orange;
  color:blueviolet;
}
.tabs > .strip > [panel]:current  /*active tab*/
{
  margin:-2px -2px -1px -2px;
  padding: 4px 10px 5px 10px; 
  background-color-bottom-right: window;
  background-color-bottom-left: window;
  position:relative;
}

.tabs > .strip > [panel]:current:hover /*active tab*/
{
  //color:red;
}

.tabs:tab-focus > .strip > [panel]:current > * /* outline active tab content if we've gotten focus by tab*/
{
  outline: 1px dotted invert;
}

.tabs > [name] { display:none; }
.tabs > [name]:expanded // current panel
{ 
  padding:10px;
  display:block; 
  width:*;
  height:*;
  border:1px solid threedshadow;  
  border-top-style:none;  
  background-color: #e9e8f3 #bdbccc #bdbccc #e9e8f3;
  padding-left:20px;
  padding-right:20px;
}

  table#players tr { context-menu:selector(menu#row-menu); } 

table#players > tr.noshow
{
    display:none;
}

.settings
{
    behavior: ~settings;
}


#btnInventory, #btnSelectPath
{
    behavior: ~minclosebtns;
}

[state="error"]
{
    border: 1px solid red;
}

.selectmode
{
    behavior: ~minclosebtns;
}

browse.exe отображает правильно. вкладки отображаются и переключаются.
Свежепостроенное приложение отображает только закладки. Сами вкладки не видны и не переключаются.
Что я неправильно делаю?

Здравствуйте, DemonS, Вы писали:

DS>нашел похожую тему здесь
DS>но включение behavior_tabs.cpp мне не помогает...

Разобрался. Сам и отвечу. Помогло следующее:
в OnInitDialog:

    HTMLayoutSetCallback(m_hWnd,&HTMLayoutNotifyHandler,this);

Определил HTMLayoutNotifyHandler:

// HTMLayout specific notification handler.
LRESULT CALLBACK HTMLayoutNotifyHandler(UINT uMsg, WPARAM wParam, LPARAM lParam, LPVOID vParam)
{
    // all HTMLayout notification are comming here.
    NMHDR*  phdr = (NMHDR*)lParam;
    CRrrDlg*    owner = static_cast<CRrrDlg*> (vParam);

    switch(phdr->code)
    {
    case HLN_CREATE_CONTROL:    break; //return OnCreateControl((LPNMHL_CREATE_CONTROL) lParam);
    case HLN_CONTROL_CREATED:   break; //return OnControlCreated((LPNMHL_CREATE_CONTROL) lParam);
    case HLN_DESTROY_CONTROL:   break; //return OnDestroyControl((LPNMHL_DESTROY_CONTROL) lParam);
    case HLN_LOAD_DATA:         return owner->OnLoadData((LPNMHL_LOAD_DATA) lParam);
    case HLN_DATA_LOADED:       break; //return OnDataLoaded((LPNMHL_DATA_LOADED)lParam);
    case HLN_DOCUMENT_COMPLETE: break; //return OnDocumentComplete();
    case HLN_ATTACH_BEHAVIOR:   return htmlayout::behavior::handle((LPNMHL_ATTACH_BEHAVIOR)lParam );
    }
    return 0;
}

Внимательно смотрим на строчку с "HLN_ATTACH_BEHAVIOR", вот из-за отсутствия таковой умолчательное поведение behavior_tabs не привязывалось куда надо... Может, кому поможет...

	От:	DemonS
	Дата:	26.08.10 12:05
	Оценка:

	От:	DemonS
	Дата:	26.08.10 13:55
	Оценка:

	От:	DemonS
	Дата:	26.08.10 16:23
	Оценка: