it-swarm-ko.com

격자에서 긴 열 머리글을 표시하는 방법

그리드에 데이터를 표시 할 때 (각 행에 레코드가 있고 각 열에 다른 레코드 필드가 있음) 스크롤 또는 페이징을 통해 수직 공간 요구를 쉽게 해결할 수 있습니다.

일반적으로 열 또는 열 데이터 수가 많아 질수록 수평 공간이 더 빨리 누락됩니다. 이 주제는 이미 여기에서 논의되었습니다 : 너무 많은 데이터를 표시하는 방법 이것은 내 질문의 요점이 아닙니다.

일부 열에는 약간의 공간 (확인란, 날짜 또는 아이콘)을 차지하는 데이터가 있지만 헤더 레이블이 길습니다. 결과적으로 데이터가 아니라 헤더로 인해 열이 넓어지고 가로 공간이 현저히 손실됩니다.

몇 가지 간단한 해결책이 있습니다.

  • 더 짧은 헤더 텍스트를 찾으십시오
  • 헤더 텍스트를 여러 줄로 감싸십시오.
  • 헤더 텍스트를 세로로 표시
  • 완전한 레이블을 포함하는 툴팁 위에 마우스로 약어를 표시합니다.
  • 아이콘을 헤더로 사용

이러한 솔루션 중 어느 것도 적용 할 수없는 경우가 있으며 동시에 UI를 명확하고 이해하기 쉽게 유지합니다. 당신의 솔루션은 무엇입니까?

13
Mart

내가 본 가장 널리 사용되는 방법은 줄임표를 사용하여 다음과 같이 더 많은 텍스트가 있음을 나타냅니다.

alt text

그런 다음 마우스 오버시 툴팁을 제공하여 사용자에게 완전한 이름을 표시 할 수 있습니다. Mac OS에서 Apple 첫 번째 단계로 텍스트를 압축하려고 시도합니다. 글자와 단어 사이의 간격을 줄임으로써 텍스트를 압축합니다. 아이디어를 추가하기 전에 가능한 한 많은 문자를 표시하는 것이 좋습니다 최후의 수단으로 줄임표.

마지막으로 표시 가능한 문자가 사라지는 어딘가에서 응용 프로그램에서 훨씬 더 우아한 접근법을 보았습니다. 앱 이름을 기억할 수 없지만 다음과 같습니다.

alt text

이것은 분명히 더 많은 작업이지만 확실히 더 현대적이고 고급스럽게 보입니다. 아직 Mac OS의 표준 기능이되지 않은 것에 놀랐습니다. 말하자면 Apple does 스포트라이트에서 페이딩을 사용하여 긴 파일 경로를 보여줍니다.

alt text

페이드 파일 경로 외에도 "YLListenerBase.cpp"파일을 참조하십시오. .h 파일과 비교하면 압축 된 것을 볼 수 있습니다. 페이딩 효과가있는 파일 경로는 창의 맨 아래에 있습니다.

7
Hisham

나는 다른 질문에 대한 의견에서 이것을 제안했다고 생각하지만, 요약하면 ... 아이콘이 열의 의미를 정확하게 설명 할 수있을 때 아이콘을 제안 할 것입니다.

alt text

다른 질문에서 인용 comment

예 : 단일 문자 만 포함하는 열이있는 경우 (예 : Y/N /? 또는 0/1/2/3 /? 또는 T/F) 헤더에 아이콘 또는 약어 텍스트를 사용할 수있는 경우 열 너비를 크게 줄일 수 있습니다. 예 : "숫자"열이 있으면 대신 "#"을 사용하면 공간이 절약됩니다.

3
scunliffe

당신의 목록은 매우 철저합니다. 할 수있는 일은 많지 않지만 상황에 가장 적합한 것을 선택하십시오.

  • 머리글이 여러 단어이면 줄 바꿈이 가장 좋습니다. 적절한 하이픈을 사용하면 가끔 긴 단어를 분리 할 수도 있습니다. 임의의 지점에서 단어를 분리하지 마십시오.

  • 아이콘이 앱의 다른 곳에 이미 설정되어 있지 않으면 일반적으로 아이콘보다 추측 가능한 약어를 얻는 것이 더 좋습니다. 기존 약어를 사용하지 않는 경우 컨텍스트에서 테스트하여 사용자가 추측 할 수 있는지 확인하십시오. 예, 아이콘이나 약어를 사용하든 툴팁을 사용하되 일반적인 용도로는 사용하지 마십시오. 약어는 일반적으로 마침표가 필요하지 않으므로 공간이 절약됩니다.

  • 머리글을 세로로 표시하면 문자를 서로 쌓아 올리지 않고 텍스트를 옆으로 쓰면 가독성이 향상됩니다.

  • 머리글을 세로로 표시하지 않고 상단의 열을 "구부리"고 30 ~ 45도 각도로 머리글 텍스트를 표시하십시오. 이제 머리 끝을 약간만 읽어서 읽을 수 있습니다. 그러나 긴 헤더가있는 인접한 열이 많은 경우에만 작동합니다.

  • 필드 값이 다른 필드에서 동일한 너비 인 경향이있는 (예를 들어, 열차 일정 표시와 같은) 일부 그리드의 경우 열을 행으로 바꾸는 것이 좋습니다. 이제 열 머리글은 행 머리글이므로 공간을 낭비하지 않고 필요한만큼 길 수 있습니다.

그리드에서 가로 스크롤에 대한 법은 없음을 기억하십시오. 사용자는 스프레드 시트를 사용하여 수년 동안 해왔습니다.

2
Michael Zuschlag

기둥 위에 쌓인 '구름'을 사용하는 것이 어떻습니까? 그들이 정말로 오랫동안 그렇게 중요하다면 미치십시오.

       ________________   _____________
      |Super Long Title| |I'm also long|
               ^            ^
| Foo | Bar |  |   | Baz |  |  | FooBar |
|  x  |  y  |   z  |  xy |  yx |  xyz   |
|  x  |  y  |   z  |  xy |  yx |  xyz   |
|  x  |  y  |   z  |  xy |  yx |  xyz   |
|  x  |  y  |   z  |  xy |  yx |  xyz   |
|  x  |  y  |   z  |  xy |  yx |  xyz   |
|  x  |  y  |   z  |  xy |  yx |  xyz   |
|  x  |  y  |   z  |  xy |  yx |  xyz   |
|  x  |  y  |   z  |  xy |  yx |  xyz   |
2
Dominic Hopton

좋은 해결책이 이미 언급되었습니다. 고려해야 할 사항은 다음과 같습니다. 열과 범례에 색, 숫자 또는 문자 식별자를 사용하십시오.

Color and Letter Identifyers

1
Ray Perfetti