Preview Panel

Тема в разделе "Lotus - Xpages", создана пользователем YGol, 23 янв 2014.

  1. YGol

    YGol Member

    Регистрация:
    25 ноя 2013
    Сообщения:
    23
    Симпатии:
    0
    Всем привет.
    Сталкивался ли кто нибудь с задачей отображения странички как почта в толстом клиенте, с возможностью превью панели?
    Рылся в инете ничего пока не нашел.
    Собственно задача динамически делить экран пополам перекладиной, вехняя и нижняя часть с прокруткой при необходимости (как в толстом клиенте превью), и общая прокрутка страницы отключена.
    Сделал xpage и в стиле указал overflow: hidden (но главная прокрука всей страницы в ней осталась, хоть и неактивна),
    в странице 2 Dojo Content Panel (overflow: scroll), у каждой я так понял высоту можно задать в процентах.
    Где взять перекладину которую можно будет тянуть вверх вниз и передавать эти значения в панели? ;)
    Ну или может у кого нибудь есть другое решение:)
     
  2. NickProstoNick

    NickProstoNick Статус как статус :)

    Регистрация:
    22 авг 2008
    Сообщения:
    1.766
    Симпатии:
    39
    Как-то так. В контейнеры помещаешь то что тебе надо. В верхний - репитконтрол с документами без ограничения количества документов.
    Сообщение между видом и превьюв - через переменную окружения viewScope или через compositeData
    <div class="sp-wrap"><div class="sp-head-wrap"><div class="sp-head folded clickable">Код страницы</div></div><div class="sp-body"><div class="sp-content"><!--shcode--><pre><code class='xml'><?xml version="1.0" encoding="UTF-8"?>
    <xp:view xmlns:xp="http://www.ibm.com/xsp/core"
    xmlns:xe="http://www.ibm.com/xsp/coreex"
    xmlns:xc="http://www.ibm.com/xsp/custom">
    <xp:this.resources>
    <xp:styleSheet href="/tst.css"></xp:styleSheet>
    </xp:this.resources>
    <xp:panel styleClass="content">

    <xp:panel styleClass="left"></xp:panel>

    <xp:panel styleClass="top">
    1<xp:br></xp:br>2<xp:br></xp:br>3<xp:br></xp:br>4<xp:br></xp:br>5<xp:br></xp:br>
    6<xp:br></xp:br>7<xp:br></xp:br>8<xp:br></xp:br>9<xp:br></xp:br>0<xp:br></xp:br>
    1<xp:br></xp:br>2<xp:br></xp:br>3<xp:br></xp:br>4<xp:br></xp:br>5<xp:br></xp:br>
    6<xp:br></xp:br>7<xp:br></xp:br>8<xp:br></xp:br>9<xp:br></xp:br>0<xp:br></xp:br>
    1<xp:br></xp:br>2<xp:br></xp:br>3<xp:br></xp:br>4<xp:br></xp:br>5<xp:br></xp:br>
    6<xp:br></xp:br>7<xp:br></xp:br>8<xp:br></xp:br>9<xp:br></xp:br>0<xp:br></xp:br>
    1<xp:br></xp:br>2<xp:br></xp:br>3<xp:br></xp:br>4<xp:br></xp:br>5<xp:br></xp:br>
    6<xp:br></xp:br>7<xp:br></xp:br>8<xp:br></xp:br>9<xp:br></xp:br>0<xp:br></xp:br></xp:panel>

    <xp:panel styleClass="bottom">
    1<xp:br></xp:br>2<xp:br></xp:br>3<xp:br></xp:br>4<xp:br></xp:br>5<xp:br></xp:br>
    6<xp:br></xp:br>7<xp:br></xp:br>8<xp:br></xp:br>9<xp:br></xp:br>0<xp:br></xp:br>
    1<xp:br></xp:br>2<xp:br></xp:br>3<xp:br></xp:br>4<xp:br></xp:br>5<xp:br></xp:br>
    6<xp:br></xp:br>7<xp:br></xp:br>8<xp:br></xp:br>9<xp:br></xp:br>0<xp:br></xp:br>
    1<xp:br></xp:br>2<xp:br></xp:br>3<xp:br></xp:br>4<xp:br></xp:br>5<xp:br></xp:br>
    6<xp:br></xp:br>7<xp:br></xp:br>8<xp:br></xp:br>9<xp:br></xp:br>0<xp:br></xp:br></xp:panel>

    </xp:panel>
    </xp:view>[/CODE]
    <div class="sp-wrap"><div class="sp-head-wrap"><div class="sp-head folded clickable">стили CSS</div></div><div class="sp-body"><div class="sp-content"><!--shcode--><pre><code class='css'>.content{

    }

    .left{
    float: left;
    height: 100%;
    width: 20%;
    overflow-y:scroll;
    background-color: teal;
    }

    .top{
    margin-left: 20%;
    height: 70%;
    overflow-y:scroll;
    background-color: red;
    }

    .bottom{
    margin-left: 20%;
    height: 30%;
    overflow-y:scroll;
    background-color: yellow;
    }[/CODE]
     
  3. YGol

    YGol Member

    Регистрация:
    25 ноя 2013
    Сообщения:
    23
    Симпатии:
    0
    Сообщение между видом и превьюв - через переменную окружения viewScope или через compositeData

    Благодарю, я так сделал, но когда мышь на границе панелей, она не видит разграничения и перекладину сместить не получается.
    может Dojo Border Container надо использовать? пока не понял где обработчик события по вытягиванию панели должен быть
     
  4. NickProstoNick

    NickProstoNick Статус как статус :)

    Регистрация:
    22 авг 2008
    Сообщения:
    1.766
    Симпатии:
    39
    ааа... так ты еще и "тянуть" превьюв хочешь? Говорить надо

    <div class="sp-wrap"><div class="sp-head-wrap"><div class="sp-head folded clickable">Код страницы</div></div><div class="sp-body"><div class="sp-content">
    <!--shcode--><pre><code class='xml'><?xml version="1.0" encoding="UTF-8"?>
    <xp:view xmlns:xp="http://www.ibm.com/xsp/core"
    xmlns:xe="http://www.ibm.com/xsp/coreex"
    xmlns:xc="http://www.ibm.com/xsp/custom">
    <xp:this.resources>
    <xp:styleSheet href="/tst.css"></xp:styleSheet>
    </xp:this.resources>

    <xe:djBorderContainer id="djBorderContainer1" styleClass="content" liveSplitters="true">

    <xe:djBorderPane id="djBorderPane1" region="left" splitter="true" styleClass="left">1</xe:djBorderPane>

    <xe:djBorderPane id="djBorderPane3" region="center" splitter="true">

    <xe:djBorderContainer id="djBorderContainer2" liveSplitters="true">
    <xe:djBorderPane id="djBorderPane4" region="top" splitter="true" styleClass="top">2</xe:djBorderPane>
    <xe:djBorderPane id="djBorderPane2" splitter="true" region="center" styleClass="bottom">3</xe:djBorderPane>
    </xe:djBorderContainer>

    </xe:djBorderPane>

    </xe:djBorderContainer>
    </xp:view>[/CODE]

    <div class="sp-wrap"><div class="sp-head-wrap"><div class="sp-head folded clickable">CSS</div></div><div class="sp-body"><div class="sp-content">
    <!--shcode--><pre><code class='css'>.content{

    }

    .left{
    height: 100%;
    width: 20%;
    overflow-y:scroll;
    }

    .top{
    height: 65%;
    overflow-y:scroll;
    background-color: red;
    }

    .bottom{
    height: 30%;
    overflow-y:scroll;
    background-color: yellow;
    }[/CODE]
     
  5. YGol

    YGol Member

    Регистрация:
    25 ноя 2013
    Сообщения:
    23
    Симпатии:
    0
    дык в главном сообщении так и написал ;)
     
  6. NickProstoNick

    NickProstoNick Статус как статус :)

    Регистрация:
    22 авг 2008
    Сообщения:
    1.766
    Симпатии:
    39
    Когда я отвечал - первое сообщение не было редактировано. Изначально вопрос был просто делить страницу.
    Смотри мой предыдущий пост.
     
  7. YGol

    YGol Member

    Регистрация:
    25 ноя 2013
    Сообщения:
    23
    Симпатии:
    0
    В общем вот :)
    +ставим свойство splitter=true на нужной бордер панели
    Код (Text):
    <xe:djBorderContainer id="djBorderContainer1" style="width:400px; height:200px;">
    <xe:djBorderPane id="djBorderPane1" region="top">top</xe:djBorderPane>
    <xe:djBorderPane id="djBorderPane2" region="center">center</xe:djBorderPane>
    <xe:djBorderPane id="djBorderPane3" region="bottom">bottom</xe:djBorderPane>
    <xe:djBorderPane id="djBorderPane4" region="left">left</xe:djBorderPane>
    <xe:djBorderPane id="djBorderPane5" region="right">right</xe:djBorderPane>
    </xe:djBorderContainer>
     
  8. NickProstoNick

    NickProstoNick Статус как статус :)

    Регистрация:
    22 авг 2008
    Сообщения:
    1.766
    Симпатии:
    39
    Из примеров выдирать все умеют :(
     
Загрузка...

Поделиться этой страницей