Scroll Bars

スクロールバー

Now, let's find out to add scroll bars to a window.

今回は、ウィンドウにスクロールバーを追加することを見ていきましょう。

Adding Scroll Bars

スクロールバーを追加する

A scroll bar is typically used so that a user can move around in a large document. You can also use it when you need to ask for a value that falls within a certain range. Scroll bars can be created in a number of ways. In XUL, one can be created using the scrollbar tag. Some elements, such as text boxes, will also add scroll bars as necessary when the content inside is too large.

スクロールバーは、多くの場合、ユーザが大きな文書内を移動できるようにするために 使われます。その他に、ある範囲内の値を要求する必要がある場合にも使われます。 スクロールバーを作る方法はたくさんあります。XUL では、 scrollbar タグを使って 作ることができます。テキストボックスのような要素では、その内容が非常に大きい 場合には、必要に応じてスクロールバーが追加されるでしょう。

In this section, we'll discuss creating a stand-alone scroll bar. The user will set the value by adjusting the scroll bar. You probably won't use this too often. A scroll bar is made up of several parts, the slider, which is the main part of the scroll bar with the adjustable box, and the two arrow buttons on the end. A scroll bar creates all of these elements automatically.

この節では、スタンドアローンのスクロールバーの作り方について説明します。 それは、ユーザは、スクロールバーを調整することで値を設定します。多分そんなには この使い方はしないでしょう。スクロールバーは、幾つかの部品からできています。 スクロールバーの主部品であるスライダー、これは、調整可能なボックスをもちます。 それと、両端の 2 つの矢印ボタンです。スクロールバーは、これらの要素すべてを、 自動的に作ります。

The syntax of a scroll bar is as follows:

スクロールバーの構文は、次の通りです:

<scrollbar
    id="identifier"
    orient="horizontal"
    curpos="20"
    maxpos="100"
    increment="1"
    pageincrement="10"/>

The attributes are as follows:

属性は次の通りです:

  • id
    The unique identifer of the scroll bar
  • orient
    This specifies the direction of the scroll bar. The default is horizontal, which creates a scroll bar that extends from left to right. You can also specify vertical which creates a scroll bar that extends from top to bottom.
  • curpos
    This indicates the current position of the scroll bar thumb (the box that you can slide back and forth.) The value ranges from 0 to the value of maxpos. This value does not need a unit. The default value is 0.
  • maxpos
    This indicates the maximum position of the scroll bar thumb. The is a numeric value and does not have a unit. The default value is 100.
  • increment
    The value here specifies how much the value of curpos changes by when the user clicks on one of the scroll bar arrows. The default value is 1.
  • pageincrement
    The value here specifies how much the value of curpos changes by when the user clicks pages through the scroll bar, which can be done by clicking on the tray between the box and the arrows. The default value is 10.
  • id
    スクロールバーの一意な識別子。
  • orient
    これは、スクロールバーの方向を指定する。デフォルトは horizontal で、左から右に広がるスクロールバーを作る。 vertical を指定することもできる。 これは上から下に広がるスクロールバーを作る。
  • curpos
    これは、スクロールバーのサムネイル (前後にスライドできるボックス) の現在位置を指定する。値は、0 から maxpos の値までの間である。この値に単位はない。デフォルト値は 0 である。
  • maxpos
    これは、スクロールバーのサムネイルの最大位置を指定する。 値は数値で、単位はない。デフォルト値は 100 である。
  • increment
    ユーザがスクロールバーの矢印の一つをクリックしたとき、 curpos の値がどれだけ変化するかを指定する。 デフォルト値は 1 である。
  • pageincrement
    ユーザがスクロールバーのページングをしたとき、 curpos の値がどれだけ変化するかを指定する。 これは、スクロールバーのボックスと矢印の間のトレイをクリックすればできる。 デフォルト値は 10 である。

The example given in the syntax above will create a scroll bar that can range from a value of 0 to 100. The value 100 might be the number of lines in a list, but it could be anything you want. The initial value in this example is 20. When clicking on one of the scroll bar arrows, the value would change by 1 either up or down. By paging through the scroll bar, the value will change by 10.

上の構文で示した例では、0 から 100 までの値をもつことのできるスクロールバーを 作ります。100 という値はリスト内の線の数であるかもしれませんが、必要な任意の 値にすることができます。この例での初期値は 20 です。 スクロールバーの矢印の一つをクリックすると、値は上か下に 1 変化します。 スクロールバーをページングすると、値は 10 変化します。

When the user clicks the scroll bar arrows, the thumb will move by the amount specified by the value increment. Increasing the value of this attribute will cause the scroll bar to move farther with each click. The leftmost or topmost position of the scroll bar has the value 0 and the rightmost or bottommost position of the scroll bar has the value given by maxpos.

ユーザがスクロールバーの矢印をクリックすると、サムネイルは increment の値によって指定された量だけ動きます。 この属性の値を増やすと、スクロールバーはクリックのたびにもっとたくさん動く ことになります。スクロールバーの左端または上端の位置の値は、0 です。 スクロールバーの右端または下端の値は、maxpos によって指定した値です。

By adjusting the values of the scroll bar, you can have the thumb positioned just as you want it and the change when the user clicks the arrows just as you want it.

スクロールバーの値を調整することによって、サムネイルを望みの位置に置くことができます。 また、ユーザが矢印をクリックしたときの変化も、望みの値にすることができます。


(Next) Next, we'll find out how to create toolbars.

(進む) 次は、ツールバーの作り方を見ることにしましょう。


Copyright (C) 1999 - 2004 XulPlanet.com
訳者: kmine
このドキュメントのオリジナルは XULPlanet において英語で公布されています。
またドキュメントの管理の言語は現在も英語です。この日本語訳は、
利用者の利便のために Mozilla Japan 翻訳部門によって提供されたものです。
フィードバックは英語で、元の著者に送って下さい。
翻訳された文書の一覧は、現在以下のURLで見ることが出来ます。
http://www.mozilla.gr.jp/jt/xul/progress.html