2012-06-28 4 views
0

GWT 위젯에서 요소의 위치를 ​​지정하는 가장 좋은 방법은 무엇입니까?GWT에서 요소를 배치하는 가장 좋은 방법은 무엇입니까?

작업이 있다고 가정 해 보겠습니다. 페이지 레이아웃에 위젯 집합을 배치하십시오. 모든 버튼과 입력을 순서대로 배치하려면 무엇을 사용합니까?

  • GWT 위젯의 위치에 대한 패널, 그리드, 테이블 + CSS 스타일 :
  • GWT 위젯을 배치하기위한 테이블/div의 + CSS 스타일과

    1. 의 standart HTML 마크 업 패널, 그리드, 테이블 + 그 나라의 특성에 대한 위치 지정

    2 개 또는 3 개 - colspans, 고정 너비 열 및 패딩이있는 표준 HTML 테이블을 재현하는 데 사용 하시겠습니까?

    ps UIBinder 및 XML 마크 업. GWT 2.4


    내 의견 : GWT의 가장 큰 장점 중하나는 HTML 마크 업을 쓰는 프로그래머를 방지하고 인터페이스에 대한 크로스 브라우저 지원을 추가 할 수있는 기능입니다. 그것의 더 나은 P.3을 선택하고 ONLY 장식 CSS를 사용하려고 할 수 있도록 우리는이 점을 떨어 뜨리지한다 - 즉, 색상, 글꼴 등을보기

    또 다른 점 :그 나쁜 생각은 어떤을 배치하기 인라인 스타일. XML 마크 업에서 위젯의 속성을 지정함으로써 문자 그대로 정확히 이것을 수행합니다. 또한 GWT에는 일반 레이아웃을 생성 할만큼 위젯이 없습니다. 예를 들어, collspans 및 고정 열 너비가있는 간단한 테이블을 작성해야합니다. 어떻게 이것에 대해 가겠습니까? 여러 개의 HorizontalPanels을 VerticalPanels에 포함하고 모든 사용자의 너비/높이를 지정하고 이에 따라 XML의 훌륭한 종이를 만들어야하는 것처럼 보입니다.


    귀하의 의견은 무엇입니까?

  • 답변

    7

    GWT는 끔찍한, 끔찍한, 좋지 않은, 매우 나쁜 HTML을 생성합니다. 이것은 단지 제 의견이며, 다른 사람들은 동의하지 않을 것입니다. 하지만 나는 GWT와 매일 같이 일하고 무한히 중첩 된 div와 테이블은 초보자 웹 개발자조차 울기에 충분합니다. 그리고 그 모든 스타일은 인라인입니다. 따라서 외부 스타일 시트를 적용하거나 덮어 쓰려면, !important 선언의 포레스트로 끝날 것입니다.

    그러나 놀라운 자바 스크립트를 생성합니다. 한때 최고로 복잡한 DHTML 프로젝트를 유지하고 개발하고 IE 5.5 이상을 지원해야했던 사람인 - 손으로 을 작성했습니다.이 글은 GWT의 가장 좋은 부분입니다.

    필자는 DHTML 순수 주의자이며 소프트웨어 개발자가되기 훨씬 전에 웹 개발자였습니다. 개인적으로 나는 HTML이 단지 구조를위한 것이어야하고, CSS는 스타일링을 제공해야하고, JavaScript는 다른 기능을 제공해야한다고 생각합니다.이 세 가지 모두 완전히 분리되어야합니다. GWT는 JavaScript의 마지막 부분을 꽤 잘 처리하지만 생성 된 HTML은 감수성에 불쾌감을 주며 적어도 10 배 이상 복잡합니다. 그러나 또 다시, 대부분의 생성 된 코드가 있습니다. (MS Word에서 만든 웹 사이트 또는 WYSIWYG 스타일 편집기에서 생성 한 HTML을 고려하십시오.)

    웹 기반의 복잡한 응용 프로그램과 Ruby on Rails 응용 프로그램 롤링에 대한 제한 사항을 감안할 때 GWT를 사용해 보겠습니다. 그러나 내 응용 프로그램은 FlowPanel (HTML <div>으로 컴파일 됨) 및 GWT 생성 Javascript 콜렉션이 될 것입니다. 맨 위에 자체 CSS가 있습니다. 따라서 OP가 내놓은 상황에서 FlowPanel을 사용하고 요소 (예 : GWT 양식 요소)를 추가하고 서버 측 로직을 적용한 다음 외부 CSS로 스타일을 지정합니다.

    GWT를 볼 때 나중에 응용 프로그램을 다시 디자인하고 싶거나 디자이너 나 다른 프로그래머가 템플릿/스타일/CSS를 만들어서 맨 위에 적용하고 싶을 수도 있습니다 . 이것이 온다면 스타일을 적용하지 않고 GWT 앱을 디자인 할 때 클래스와 ID를 적용 할 때 매우 신중해야합니다.

    테스트 참고 사항 : UI 테스트를 위해 Selenium을 사용하려는 경우 은 실제로에 ID를 걸고 싶어합니다. 생성 된 HTML의 xpath는 사실상 불가능하며 길이가 수백 자로 늘어날 수 있습니다.

    다른 사람들의 경험에 대해 듣고 싶습니다. 특히 내 것과 다른 경우 특히 그렇습니다.

    TL; DR 버전 :

    1. GWT-생성 된 HTML은, GWT는 CSS 스타일 시트를 생성하지 않습니다
    2. 중첩 된 테이블과 중첩 <div>의 여러 층 (필요 이상으로) 꽤 나쁜 있지만, 모든 스타일을 인라인으로 배치합니다. 이것은 외장 스타일 시트를 지루하고 어렵게 만든다.
    3. GWT는 브라우저 간 Javascript로 훌륭한 작업을 수행합니다.
    4. GWT는 기본적으로 id를 요소에 첨부하지 않으므로 Selenium과 같은 도구를 사용할 계획이라면 직접 본 적이없는 것처럼 자신의 ID를 손으로 추가하거나 굉장히 긴 xpath를 처리해야합니다.
    +0

    현재 일반 GWT는 실제로 레이아웃 등을 사용하지 않습니다 (그리드 등을 명시 적으로 사용하는 경우 제외). 또한 인라인 스타일을 많이 사용하지도 않습니다 (그리고 그것이있는 곳에서는 일반적으로 의미가 있습니다). 어쩌면 당신은 오래된 (이전 GWT 2.0 이전) 패널 (예 : HorizontalPanel, VerticalPanel, StackPanel)을 사용하고 있거나 GXT와 같은 프레임 워크를 사용하고있을 것입니다. (정말 깊이 겹쳐 쌓인 테이블 기반 HTML을 실제로 생성합니다. GXT가 의도적으로 매우 다른 접근 방식을 사용하기 때문에 일반 GWT 레이아웃과 관련이 많다. –

    +0

    4. 이전에는 보지 못했던 "놀라 울 정도로 긴 xpath가 아니라"ensureDebugId()를 사용하지 않으시겠습니까? – Arcadien

    +0

    @Arcadien - 여전히 코드가 추가되었습니다. 나는 또한 다른 누군가의 프로젝트에서 일하고있다. 나는이 것을 처음부터 만들지 않았다 - 다시 돌아가서 id를 요소에 추가하는 것은 힘든 일이다. "ensureDebugId"또는 이와 유사한 것을 사용하는 것은 "직접 자신의 ID를 추가해야합니다"라는 의미입니다. –

    관련 문제