2010-03-09 2 views
4

콘텐츠를 설정하려면 com.google.gwt.user.client.ui.TextArea.setText(myText)으로 전화하십시오. 그 다음에 나는 setCursorPosition(myText.length())으로 커서를 끝까지 가져온다. 이것은 잘 작동합니다.GWT TextArea를 스크롤하는 방법은 무엇입니까?

myText에 줄이 더 있으면 텍스트 영역을 한 번에 표시 할 수 있으며 스크롤 막대가 표시됩니다. 그러나 커서 위치로 스크롤하지는 않습니다. 더 나쁜 것은 - 그것은 맨 위로 스크롤합니다.

어떻게 GWT ​​TextArea를 커서 위치로 스크롤 할 수 있습니까? 실제로 TextArea의 하단이 아닌 커서 위치가 필요합니다. JSNI 해결 방법도 괜찮습니다. 커서 위치를 설정 한 후이 추가

답변

3

나는 이미 텍스트 영역에 뭔가가있을 것이며 새 명령이 제출되면 데이터를 추가하고 새로 추가 된 데이터의 시작 부분으로 스크롤합니다. 이것은 내가, 당신은 텍스트의 줄 수를 계산 한 다음를 기반으로 최고 위치를 설정할 수 있습니다 처리 후 스타의 대답에 개선하기 위해 새로운 데이터

 int posCount = 0; 
     if (previousResponse != null && !previousResponse.isEmpty()) 
     { 
      final String dataStr = "new data from process"; 
      // add 15 lines for the cursor position 
      posCount = getRelativeCount(dataStr); 
     } 
     this.textArea.getElement().setScrollTop(prevHeight); 
     this.textArea.setCursorPos(prevPos + posCount); 

private int getRelativeCount(final String str) 
{ 
    int charCount = 0; 

    if (str != null) 
    { 

     int NUM_ROWS = 15; 

     if (getUserAgent().contains("msie")) 
     { 
      NUM_ROWS = 16; 
     } 

     final String[] splitArr = str.split("\n"); // split on the new line 
                // char 

     for (int index = 0; index < splitArr.length && index < NUM_ROWS; index++) 
     { 
      charCount += splitArr[index].length(); 
     } 
    } 
    return charCount; 
} 
3

시도 :

textAreaToScroll.getElement().setScrollTop(textAreaToScroll.getElement().getScrollHeight()); 

이 바닥에 요소를 스크롤됩니다.

편집 :

이 (내가 아는 한)이 어떤 커서 위치가로 이동하려면 이렇게하는 쉬운 방법. 나는 브라우저가 커서가 켜져 있는지를 묻는 방법이 없다고 생각한다. 방금 ​​스크롤 할 시간의 대략적인 추정치를 추측 할 수있는 (실제로 테스트하지 않은) 아이디어가 있습니다.

int cursorPos = textAreaToScroll.getCursorPos(); 
long offsetRatio = cursorPos/textAreaToScroll.getText().length(); 
//gives 0.0 to 1.0 
offsetRatio += someMagicNumber; // -0.1 maybe? 
// Depending on the font you may need to adjust the magic number 
// to adjust the ratio if it scrolls to far or to short. 
offsetRatio = offsetRatio>0.0 ? offsetRatio : 0; //make sure 
//we don't get negative ratios 
//(negative values may crash some browsers while others ignore it) 
textAreaToScroll.getElement().setScrollTop(
    textAreaToScroll.getElement().getScrollHeight() * offsetRatio); 

대략 원하는 거리로 스크롤 할 수 있습니다. 이것은 커서 위치를 텍스트의 길이로 나눈 것이고 줄 수는 나지 않는 (계산하기 어렵다) 점을 감안할 때 각 줄은 거의 같은 양으로 채워져 있다고 가정합니다. 수동 개행 문자는이 추정치를 왜곡하고 비례 글꼴은 정확하지 않게 만듭니다.

커서가 텍스트 영역의 상단보다 약간 아래쪽에있는 경우 커서가 계속 보일 수 있으므로 너무 짧지 않게 너무 짧게 스크롤되도록 비율을 조정해야 할 수 있습니다.

내가 실제로 이것을 테스트하지 않았다고 말했기 때문에 나는 논리와 다른 미묘한 버그를 거꾸로했을지도 모른다.

+0

이 코드 불행히도 커서 위치가 아닌 TextArea를 아래로 스크롤합니다 .-( – Witek

+0

커서를 끝으로 설정하면 맨 아래 줄에 있지 않습니까? –

+0

TextArea가 끝이 아닌 커서의 위치로 스크롤하는 솔루션이 필요합니다. 예 : TextArea의 높이는 5 줄입니다. 텍스트 내용은 50 줄입니다. 커서는 25 번째 줄에 있습니다. 나는 scrollToCursorPosition() 메서드를 사용하여 줄 50이 아니라 25 번째 줄로 스크롤합니다. – Witek

1

설정

// Hold the previous height to set the scroll. 
    final int prevHeight = document.get().getElementById(textareadid).getScrollHeight(); 
    // Hold the prev position if output area already has some data. 
    final int prevPos = this.textArea.getValue() != null ? 
    this.textArea.getValue().length() : 0; 

을 한 것입니다 문자를 사용하는 것보다 총 행에 걸쳐 원하는 행에. 당신이 선을 계산하는 동안

, 당신은 또한 커서가있는 줄을 결정해야합니다

String text = textArea.getText(); 
int lines = 1; 
int pos = 0; 
int cursorPos = ...; 
int cursorLine = -1; 
while((pos = 1+text.indexOf("\n", pos)) > 0) 
{ 
    if (cursorLine == -1 && pos > cursorPos) 
     cursorLine = lines; 
    lines++; 
} 
if (lines > 0 && cursorLine > 0 && cursorLine < lines) 
{ 
    int scroll = textArea.getElement().getScrollHeight(); 
    scroll *= cursorLine; 
    scroll /= lines; 
    scroll -= 30; // Back up a bit so it's not right at the top 
    if (scroll < 0) 
     scroll = 0; 
    textArea.getElement().setScrollTop(scroll); 
} 
관련 문제