Как заставить Google Fonts применять к виджетам GWT? - PullRequest
Новая
       16

Как заставить Google Fonts применять к виджетам GWT?

1 голос
/ 05 июля 2011

Я пишу GWT-приложение, в котором все на экране находится в том или ином виджете, т.е. в HTML-файле нет ничего из обычного HTML.

Я бы хотел, чтобы весь текст отображался вопределенный веб-шрифт Google.У меня вопрос, как применить шрифт к виджетам каким-то автоматическим способом?Если я помещу CSS семейства шрифтов в тело {}, ни один из виджетов не распознает шрифт, а обычный HTML (и, как я уже сказал, этого не происходит).

Вкл.С другой стороны, я хочу избегать такого рода вещей, которые есть у меня на данный момент, в моей таблице стилей: 

.gwt-Label, .gwt-TextBox, .gwt-Button, .gwt-DialogBox .Caption, .gwt-EveryOtherKindOfWidget....
{
    font-family: Quattrocento, serif;
}

Итак, мой вопрос, как я могу получить все, чтобы унаследовать этошрифт?Я чувствую, что мне здесь не хватает чего-то довольно фундаментального.Кто-нибудь может помочь?

Спасибо, Нил

1 Ответ

1 голос
/ 06 июля 2011

Итак, здесь есть пара вопросов:

Тема GWT по умолчанию (стандартная) включает файл standard.css. Этот файл содержит определения стилей для всех виджетов. Тема определена в XML-файле вашего модуля: 

<inherits name='com.google.gwt.user.theme.standard.Standard'/>

Существуют различные способы переопределения стилей виджетов:

  1. скопируйте файл standard.css, включите его в качестве CSSResource в ClientBundle в вашем приложении и удалите строку наследования из файла XML вашего модуля.
  2. добавьте таблицу стилей, которая переопределяет стили виджетов, определенные в файле standard.css, после строки наследования в файле XML вашего модуля (см. здесь для получения более подробной информации)

т.е: 

<inherits name='com.google.gwt.user.theme.standard.Standard' />
<stylesheet src="CustomStylesheet.css" />

Глядя на таблицу стилей standard.css, вы увидите, что виджеты не определяют никаких шрифтов. Это на самом деле унаследовано от стиля тела.

выдержка из стандарта. Css: 

body, table td, select {
    font-family: Arial Unicode MS,Arial,sans-serif;
    font-size: small;
}

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

Здесь возникает вторая проблема: загрузка шрифтов Google не так проста из-за приоритета / наследования таблиц стилей.
В этой вики описано, как загрузить шрифты Google в ваше приложение GWT.

...