Doxygen custom CSS для частных, защищенных и общедоступных c предметов [решено] - PullRequest
1 голос
/ 03 марта 2020

ФОН
Я использую Doxygen v1.8.14 для документирования некоторых встроенных проектов C ++ для разработчиков. Документированные модификаторы доступа к функциям-членам класса помечены как приватные, защищенные или опубликованные c с небольшим ярлыком справа в заголовке элемента. При просмотре документации нужно искать этот ярлык далеко от того места, где находится имя функции.

enter image description here

INTENDED RESULT
Я хотел бы изменить фон заголовка элемента на синий (частный), желтый (защищенный) и зеленый (публичные c), чтобы их было легче идентифицировать.

enter image description here

ПРОБЛЕМА
Я просмотрел файл customdoxygen. css, но не могу найти теги, связанные с модификаторами доступа C ++ (private, защищено и опубликовано c). Я также проверил HTML и CSS в Firefox, но похоже, что Doxygen не различает guish модификаторов доступа (они все одного и того же CSS класса). Модификатор доступа - это простой текст в теге (кроме publi c, у которого нет тега).

<span class="mlabel">private</span>

В более раннем проекте я использовал ALIAS, чтобы переопределить способ отображения примеров кода, но это требуется новая команда разметки Doxygen (псевдоним).

Есть идеи, как это сделать или вообще возможно?

РЕДАКТИРОВАТЬ
Это было решено и представлено в моем собственном ответе с пошаговым описанием.

Ответы [ 2 ]

1 голос
/ 03 марта 2020

Плохие новости - я не верю, что у Doxygen есть специфицированная c команда / конфигурация для поддержки этого уровня настройки для сгенерированного HTML вывода.

Хорошие новости - Вы можете по-настоящему проявить креативность с помощью существующей поддержки для добавления пользовательских HTML, таких как тег HTML_HEADER . Например, вы можете включить JavaScript, чтобы проверить метку и обновить цвет фона onload () . Вот псевдокод (предупреждение - я не проверял его), показывающий предложенный подход:

<script type="text/javascript">
// Go over all labels in the file 
var labels = document.getElementsByClassName("mlabel");
for (var i = 0; i < labels.length; i++) {
   // Set all private labels to red
   if(labels.item(i).textContent == “private”) {
       labels.item(i).style.backgroundColor = "red";
   }
}
</script>
0 голосов
/ 04 марта 2020

Это довольно тривиально, и я делал что-то подобное в прошлом (о чем я совсем забыл). @albert и @diogoslima напомнили мне о настройке конфигурации HTML_HEADER, а затем я вспомнил свой старый проект. Я взглянул на это, и тогда это было легко.

Они играют ключевую роль в том, чтобы не трогать какие-либо оригинальные файлы или хотя бы как можно меньше. Прежде всего вам нужно сгенерировать файлы шаблона для настройки.

doxygen -w html header.html footer.html memberaccess.css

Для этого вы можете удалить footer.html, здесь он не будет использоваться. Откройте header.html и добавьте следующую строку в раздел <head> (как раз перед тем, как $treeview станет хорошим местом):

<script type="text/javascript" src="$relpath^memberaccess.js"></script>

... затем добавьте событие onload к <body> tag.

<body onload="DoAccessModifiers()">

Вот и все, сохраните файл header.html.

Откройте файл memberaccess.css и замените все его содержимое следующим:

/* fix empty documents */
.empty {
  border-bottom: 1px solid;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}

/* default access colors */
.memtitle {
    padding: 8px;
    border-color: #a8b8d9
    border-top: 1px solid;
    border-left: 1px solid;
    border-right: 1px solid;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    margin-bottom: -1px;
    background-image: none;
    background-color: #e2e8f2;
    color: #253555;
    line-height: 1.25;
    font-weight: 300;
    float:left;
}

/* private access colors */
.private {
      border-top: 1px solid;
      border-left: 1px solid;
      border-right: 1px solid;
      border-color: #7e96c7;
      /*color: #253555;*/
      background-color: #dfe5f1;
}

/* protected access colors */
.protected {
      border-top: 1px solid;
      border-left: 1px solid;
      border-right: 1px solid;
      border-color: #ffba3b;
      /*color: #253555;*/
      background-color: #ffe9c0;
}

/* public access colors */
.public {
      border-top: 1px solid;
      border-left: 1px solid;
      border-right: 1px solid;
      border-color: #93c77e;
      /*color: #253555;*/
      background-color: #e4f1df;
}

/* default label colors */
span.mlabel {
      background-color: #728dc1;
      border-top:1px solid #5373b4;
      border-left:1px solid #5373b4;
      border-right:1px solid #c4cfe5;
      border-bottom:1px solid #c4cfe5;
      text-shadow: none;
      color: white;
      margin-right: 4px;
      padding: 2px 3px;
      border-radius: 3px;
      font-size: 7pt;
      white-space: nowrap;
      vertical-align: middle;
}

/* private label colors */
span.private {
      background-color: #728dc1;
      border-top:1px solid #5373b4;
      border-left:1px solid #5373b4;
      border-right:1px solid #c4cfe5;
      border-bottom:1px solid #c4cfe5;
      /*color: white;*/
}

/* ptotected label colors */
span.protected {
      background-color: #728dc1;
      border-top:1px solid #5373b4;
      border-left:1px solid #5373b4;
      border-right:1px solid #c4cfe5;
      border-bottom:1px solid #c4cfe5;
      /*color: white;*/
}

/* inherited label colors */
span.inherited {
      background-color: #728dc1;
      border-top:1px solid #5373b4;
      border-left:1px solid #5373b4;
      border-right:1px solid #c4cfe5;
      border-bottom:1px solid #c4cfe5;
      /*color: white;*/
}

/* strong label colors */
span.strong {
      background-color: #728dc1;
      border-top:1px solid #5373b4;
      border-left:1px solid #5373b4;
      border-right:1px solid #c4cfe5;
      border-bottom:1px solid #c4cfe5;
      /*color: white;*/
}

/* static label colors */
span.static {
      background-color: #728dc1;
      border-top:1px solid #5373b4;
      border-left:1px solid #5373b4;
      border-right:1px solid #c4cfe5;
      border-bottom:1px solid #c4cfe5;
      /*color: white;*/
}

/* inline label colors */
span.inline {
      background-color: #728dc1;
      border-top:1px solid #5373b4;
      border-left:1px solid #5373b4;
      border-right:1px solid #c4cfe5;
      border-bottom:1px solid #c4cfe5;
      /*color: white;*/
}

/* virtual label colors */
span.virtual {
      background-color: #bbbbbb;
      border-top:1px solid #606060;
      border-left:1px solid #505050;
      border-right:1px solid #c0c0c0;
      border-bottom:1px solid #c0c0c0;
      color: #404040;
}

/* pure virtual label colors */
span.purevirtual {
      background-color: #ffffff;
      border-top:1px solid #606060;
      border-left:1px solid #505050;
      border-right:1px solid #c0c0c0;
      border-bottom:1px solid #c0c0c0;
      color: #000000;
}

/* delete label colors */
span.delete {
      background-color: #ca3939;
      border-top:1px solid #902626;
      border-left:1px solid #902626;
      border-right:1px solid #eab0b0;
      border-bottom:1px solid #eab0b0;
      /*color: white;*/
}

Затем создайте файл memberaccess.js:

function GetAccessModifier(item) {
  access = 'public';
  Array.prototype.slice.call(item.getElementsByClassName('mlabel')).forEach(function(label) {
    if (label.innerText == 'private' || label.innerText == 'protected') { access = label.innerText; }
    label.className += ' '+label.innerText.replace(/ /g, '');
  });
  return access;
}

function DoAccessModifiers() {
  Array.prototype.slice.call(document.getElementsByClassName('memitem')).forEach(function(item) {
    var title = item.previousElementSibling;
    doc = item.getElementsByClassName('memdoc')[0];
    item = item.getElementsByClassName('memproto')[0];
    modifier = " "+GetAccessModifier(item);
    title.className += modifier;
    item.className += modifier;
    if(doc.childElementCount == 0) { item.className += ' empty'; doc.parentNode.removeChild(doc); }
  });
}

Теперь, когда все файлы подготовлены, нам нужно только указать конфигурации doxygen, чтобы использовать их. Я ленивый и предпочитаю DoxyWizard для создания конфигураций, но вы можете взломать ваш любимый файл конфигурации с помощью текстового редактора, если хотите.

HTML_HEADER           = header.html
HTML_EXTRA_STYLESHEET = memberaccess.css
HTML_EXTRA_FILES      = memberaccess.js

DONE!

Чтобы изменить цвета, измените файл memberaccess.css:

.private
.protected
.public

Эти классы определяют заголовок и фон элемента, а также границы.

span.xxxx

Эти классы управляют маленькими метками справа в каждом элементе , xxxx - это то же самое, что и текст метки (пропущены пробелы).

Надеюсь, это пригодится любому, кто приземлится здесь.

...