Веб-сайт: панель навигации

#java #jsf #jakarta-ee #richfaces #primefaces

#java #jsf #джакарта-ee #богатые возможности #простые интерфейсы

Вопрос:

Я создаю простой веб-сайт.

Вверху должно быть изображение, непосредственно под ним должна быть панель навигации.

В зависимости от выбора на панели навигации содержимое должно быть заполнено (пока статично).

Я опытный разработчик Java SE / EE, но моя последняя веб-разработка была около 10 лет назад.

Я думаю, что это должно быть довольно просто, и многие веб-сайты имеют такой макет, включая RichFaces.

Обратите внимание, что меню выпадают при наведении курсора мыши на одну из записей в панели навигации.

Я использую GlassFish и хотел бы при необходимости использовать JSF и CDI (Seam?). Может быть, RichFaces или PrimeFaces поверх этого?

Как я могу создать такую панель навигации с помощью этой технологии? Я надеюсь, что есть существующий компонент, который я могу использовать повторно?

Комментарии:

1. primefaces.org/showcase-labs/ui/layoutComplex.jsf это могло бы стать хорошей отправной точкой.

2. Хм, так вы рекомендуете использовать панель меню? Это похоже, но выглядит — ну, как меню. Является ли это стандартным подходом? Просто используя (настроенный?) Компонент меню любой структуры или существует ли такая концепция, как «панель навигации» в веб-разработке? Например, Jenkis — это еще один сайт, использующий такой макет и панель навигации: jenkins-ci.org

Ответ №1:

Я не самый большой поклонник RichFaces, но мы используем его на моем текущем рабочем месте.

Что касается начала работы, я согласен с комментарием @Cagatay, хорошим местом для начала является демонстрационная страница технологии, которую вы хотите использовать. На сайте Richfaces, на который вы ссылались, есть ссылка на их демонстрационный сайт для их функций, найдите нужную функцию, просмотрите исходный код и перейдите оттуда. Это, вероятно, самое близкое, что может предложить RichFaces, которое соответствует тому, что вы ищете. Но, судя по всему, вам нужно что-то немного более привлекательное.

Кроме того, я уверен, что меню на jboss.org/richfaces сайт не использует Richfaces, только демонстрационный сайт RichFaces.

Комментарии:

1. Можете ли вы рассказать мне, какие у вас проблемы с RichFaces? Причина, по которой я рассмотрел это, связана с подключением CDI Ref impl -> Weld -> Seam -> JBoss -> RichFaces. Я думал, что использование фреймворков от одного поставщика может вызвать меньше проблем. Но NetBeans не имеет большой поддержки RichFaces, и с Eclipse у меня возникли проблемы с его развертыванием в GlassFish. Кроме того, представление, предоставляемое инструментами JBoss, выглядит сложным.

2. Хм, вы думаете, что RichFaces не использует свой собственный фреймворк для создания своего веб-сайта? Это было бы странно. Я надеялся, что такая панель навигации должна быть простой с помощью RichFaces, потому что они используют ее на домашней странице.

3. Конечно, я просмотрел демонстрационные страницы PrimeFaces и RichFaces, прежде чем публиковать здесь, но все равно спасибо 😉

4. Мне просто не нравится это с эстетической точки зрения. Однако он функционален и выполняет свою работу. Их домашняя страница размещена на jboss.org , который является домом для многих других проектов. Этот сайт будет разработан независимо, а затем просто ссылаться на дочерние сайты проекта.

Ответ №2:

Я предпочитаю простые интерфейсы, хотя версия, которую я использую (3), находится на стадии бета-тестирования и имеет некоторые ошибки; То, что вы хотите, можно было бы легко сделать так (одна версия):

 <h:form>
        <p:toolbar>
            <p:toolbarGroup>
                <p:selectOneMenu effect="drop"  value="#{options.content}" widgetVar="sel" >
                    <f:selectItem itemLabel="First Content" itemValue="FirstContent" />
                    <f:selectItem itemLabel="Second Content" itemValue="SecondContent" />
                    <p:ajax event="change" update="contentPanel,contentPanel2" />
                </p:selectOneMenu>
            </p:toolbarGroup>
        </p:toolbar>

        <p:accordionPanel id="contentPanel">
            <p:tab>
                <p:panel rendered="#{options.content eq 'FirstContent'}">
                    First Content Chosen
                </p:panel>
                <p:panel rendered="#{options.content eq 'SecondContent'}">
                    Second Content Chosen
                </p:panel>
            </p:tab>
        </p:accordionPanel>
    </h:form>
  

Скажите мне, если это то, что вы имели в виду…
(Если вы используете Primefaces 3.0.M4 с пространством имен: xmlns:p="http://primefaces.org/ui" )