トップへ戻るニュースフォーラムFLASH-ML 過去ログBak@Flaダウンロードよくある質問と答
ログイン
ユーザ名:

パスワード:


パスワード紛失

新規登録
メインメニュー
メイン
   ActionScript 3.0 特設会議室
     RadioButton コンポーネントの文字を自動改行させたい		投稿するにはまず登録を

スレッド表示 | 新しいものから 前のトピック | 次のトピック | 下へ
投稿者 スレッド
flashlite
Åê¹ÆNo.43574
投稿日時: 2009-10-2 3:34
常連
居住地: 東京
投稿: 69
使用環境:
WinXP Win7
Flash CS3,Flash CS5.0

FlashPlayer
FlashLite 1.1、2.0、2.1、3.1(下記)
Docomo SO903i
SH-08A
SoftBank 911T
　922SH
945SHG
au W61SA
S004
Disney DM001SH
Willcom Windows Mobile
　WX341k
RadioButton コンポーネントの文字を自動改行させたい
ラジオボタンコンポーネント
flash CS3(ActionScript3.0)を使用しています。

ラジオボタンで選択してもらうものを作っているのですが、
このラジオボタンに表示される文字（ラベル）は外部から動的に取得したものです。

この文字数が多く、コンポーネントの幅より長い場合、それ以降の文字が見切れてしまいます。

これを、
普通のTextFieldのwordWrapのように自動折り返し改行させたいのですが
やり方がわかりません。
何か方法がありますでしょうか？


----------------
永井勝則
Åê¹ÆNo.43593
投稿日時: 2009-10-2 20:09
職人
居住地: 白馬村
投稿: 796
使用環境:
Windows 7 :Flash CS4:
10.6.8 :Flash CS5.5
Re: RadioButton コンポーネントの文字を自動改行させたい
RadioButtonのtextFieldプロパティは通常のテキストフィールドなので、
TextFieldのプロパティが指定できます。

こんな風に、TextFieldのプロパティを好みに合うように設定してみてはどうでしょうか？

import fl.controls.RadioButton;

var labelText:String="これは相当長いテキスト。これは相当長いテキスト。これは相当長いテキスト。
これは相当長いテキスト。これは相当長いテキスト。";

var rButton:RadioButton = new RadioButton();
rButton.textField.autoSize=TextFieldAutoSize.LEFT;
rButton.textField.border=true;
rButton.textField.multiline=true;
rButton.textField.wordWrap=true;
rButton.label=labelText;

rButton.x=200;
rButton.y=200;

addChild(rButton);


----------------
永井勝則：
himco.jp :
flashlite
Åê¹ÆNo.43639
投稿日時: 2009-10-8 2:23
常連
居住地: 東京
投稿: 69
使用環境:
WinXP Win7
Flash CS3,Flash CS5.0

FlashPlayer
FlashLite 1.1、2.0、2.1、3.1(下記)
Docomo SO903i
SH-08A
SoftBank 911T
　922SH
945SHG
au W61SA
S004
Disney DM001SH
Willcom Windows Mobile
　WX341k
Re: RadioButton コンポーネントの文字を自動改行させたい
knagaiさん
回答ありがとうございます。

おかげさまで、希望の表示ができました。
RadioButtonとTextFieldのwordWrapとの関係性の理解が足りなかったです。
一つずつ変化を試していたのがダメだった要因で
rButton.textField.textWidth=200;
rButton.width = 200;//上で指定したtextWidth以上の数値を設定する必要がある？


の２行を下記に追加して、希望通りの表示が出来ることが確認できました。
ありがとうございました。


import fl.controls.RadioButton;

var labelText:String="これは相当長いテキスト。これは相当長いテキスト。これは相当長いテキスト。
これは相当長いテキスト。これは相当長いテキスト。";

var rButton:RadioButton = new RadioButton();
rButton.textField.autoSize=TextFieldAutoSize.LEFT;
rButton.textField.border=true;
rButton.textField.multiline=true;
rButton.textField.wordWrap=true;
rButton.label=labelText;

rButton.x=200;
rButton.y=200;

addChild(rButton);




----------------
flashlite
Åê¹ÆNo.43679
投稿日時: 2009-10-11 7:05
常連
居住地: 東京
投稿: 69
使用環境:
WinXP Win7
Flash CS3,Flash CS5.0

FlashPlayer
FlashLite 1.1、2.0、2.1、3.1(下記)
Docomo SO903i
SH-08A
SoftBank 911T
　922SH
945SHG
au W61SA
S004
Disney DM001SH
Willcom Windows Mobile
　WX341k
Re: RadioButton コンポーネントの文字を自動改行させたい
前回、意図した表示ができたと思いましたが

誤りでした。
あと、こちらは記述ミスなので訂正します。
×textField.textWidth　→　○textField.width

実際の環境で試したところ、（下記のコードを実行すると）改行されなかったり
ロールオーバーすると改行されたりと、うまく表示できない場合があります。

何か間違っているか、よい対処方などありますか？


import fl.controls.RadioButton;
import fl.controls.RadioButtonGroup;
var rbg:RadioButtonGroup = new RadioButtonGroup("selection");

var l1 = "PCで設定されたPower Save Extended Mode (PSEM；パワー セーブ拡張モード) モード";
var l2 = "PCで設定されたPower Save Extended Mode (PSEM；パワー セーブ拡張モード) モード拡張";
var l3 = "PCで設定されたPower Save Extended Mode (PSEM；パワー セーブ拡張モード) モー";
var l4 = "PCで設定されたPower Save Extended Mode (PSEM；パワー セーブ拡張モード)";

for (var ss:int=1; ss <= 4; ss++) {

	var rb:RadioButton = new RadioButton();
	with (rb) {
		group = rbg;
		name = String("r"+ss);
		width = 600;
		textField.border=true;
		textField.wordWrap=true;
		label = this["l"+ss];
		textField.width = 590;
		//?
		move(20,ss*30+rb.textField.height/2);
	}
	stage.addChild(rb);
	//rb.drawNow();	
}

よろしくお願いします。


----------------
永井勝則
Åê¹ÆNo.43681
投稿日時: 2009-10-12 16:20
職人
居住地: 白馬村
投稿: 796
使用環境:
Windows 7 :Flash CS4:
10.6.8 :Flash CS5.5
Re: RadioButton コンポーネントの文字を自動改行させたい
ラジオボタンのラベルを複数行にして、テキストフィールドに境界線をつけたときの動作は、確かに変で、
マウスでテキストフィールドをなぞると、テキストフィールドの文字量にフィットしようとしているかのように、境界線が微妙に変化するように見えます。

このあたりを検索して調べると下記のブログがありました。
Multiline Buttons
これはFlexコンポーネントでのラジオボタンの複数行の問題を解決する方法のようです。

で、自分なりに解決策を考えてみました。
下記コード内の33という数値は、テキストフィールドの境界線がこの値なら変わらないように見える、というわたしが決め打ちした値です。
ラジオボタンの幅がある程度の値の範囲内なら、これでうまくいくようには思えます。

import fl.controls.RadioButton;
import fl.controls.RadioButtonGroup;

var l1:String="PCで設定されたPower Save Extended Mode （PSEM：パワー セーブ拡張モード)）モード";
var l2:String="PCで設定されたPower Save Extended Mode （PSEM；パワー セーブ拡張モード)）モード拡張";
var l3:String="PCで設定されたPower Save Extended Mode （PSEM；パワー セーブ拡張モード)）モード";
var l4:String="PCで設定されたPower Save Extended Mode （PSEM；パワー セーブ拡張モード）";

var labelArray:Array=[l1,l2,l3,l4];

var rbg:RadioButtonGroup=new RadioButtonGroup("selection");

for (var i:uint=0; i< labelArray.length; i++) {
	var rb:RadioButton = new RadioButton();

	rb.textField..autoSize=TextFieldAutoSize.LEFT;
	rb.textField.multiline=true;
	rb.textField.wordWrap=true;
	rb.textField.border=true;
	rb.group=rbg;
	rb.label=labelArray[i];
	
	// 設定したいrbの幅
	rb.width=200;
	rb.textField.width=rb.width-33;

	// y位置はrb内の文字量の応じて変える
	var rbHeight:int =  rb.textField.height;
	var space:int = 20;
	
	rb.y=i*rbHeight+space;
	addChild(rb);

	if (i==0) {
		trace("tfの幅 : " + rb.textField.width);
		trace("tfの高さ: " + rb.textField.height);
		trace("rbの幅 : " + rb.width);
		trace("--------------------")
	}
}

// 確認用ボタン
btn.addEventListener(MouseEvent.CLICK, onClick);

function onClick(evt:MouseEvent) {
	var rb:RadioButton=RadioButton(getChildAt(1));
	trace("tfの幅 : " + rb.textField.width);
	trace("tfの高さ: " + rb.textField.height);
	trace("rbの幅 : " + rb.width);
}


もう１つの解決策は、ラジオボタンのラベルを""にして、ラベルがあるはずの場所に新たにテキストフィールドを作成する方法です。
ラジオボタンのテキストフィールドではなく、純然たるテキストフィールドでは、境界線がふらふら変わることはないので、この方法は上記の方法よりも汎用的です。

さらにもう１つの解決策は、境界線を表示しない方法です。


----------------
永井勝則：
himco.jp :
flashlite
Åê¹ÆNo.43705
投稿日時: 2009-10-14 23:49
常連
居住地: 東京
投稿: 69
使用環境:
WinXP Win7
Flash CS3,Flash CS5.0

FlashPlayer
FlashLite 1.1、2.0、2.1、3.1(下記)
Docomo SO903i
SH-08A
SoftBank 911T
　922SH
945SHG
au W61SA
S004
Disney DM001SH
Willcom Windows Mobile
　WX341k
Re: RadioButton コンポーネントの文字を自動改行させたい
永井勝則さん
回答ありがとうございます。

境界線を表示しない方法という解決策は、どういうものか？
まだよくわかってませんが

// 設定したいrbの幅
rb.width=200;
rb.textField.width=rb.width-33;

というwidth、とtextField.width の関係が有効ということですね。

どのような幅でも有効な方法はないか
rb.textField.width = rb.width*5/6;
のような割合など、色々ためしてみようと思います。


----------------
flashlite
Åê¹ÆNo.43867
投稿日時: 2009-11-8 4:35
常連
居住地: 東京
投稿: 69
使用環境:
WinXP Win7
Flash CS3,Flash CS5.0

FlashPlayer
FlashLite 1.1、2.0、2.1、3.1(下記)
Docomo SO903i
SH-08A
SoftBank 911T
　922SH
945SHG
au W61SA
S004
Disney DM001SH
Willcom Windows Mobile
　WX341k
Re: RadioButton コンポーネントの文字を自動改行させたい
RadioButton コンポーネントの改行について
前回、すべて解決したと思われたのですが…

RadioButtonコンポーネントのラベルを文字長さに応じて自動改行対応させた場合、
文字長さによっては、幅に余裕があるにもかかわらず
かってに改行されて表示されてしまうようです。

見た目も変なので何か対処方法はありますでしょうか？


例：下記のコード、[l4]は文字列の中で最も短いのにもかかわらず
これだけが改行されてしまいます 


import fl.controls.RadioButton;
import fl.controls.RadioButtonGroup;


var l1:String="PCで設定されたPower Save Extended Mode (PSEM；パワー セーブ拡張モード) モード";
var l2:String="PCで設定されたPower Save Extended Mode (PSEM；パワー セーブ拡張モード) モー";
var l3:String="PCで設定されたPower Save Extended Mode (PSEM；パワー セーブ拡張モード) モ";
var l4:String="PCで設定されたPower Save Extended Mode (PSEM；パワー セーブ拡張モード)";
var labelArray:Array=[l1,l2,l3,l4];

var rbg:RadioButtonGroup=new RadioButtonGroup("selection");

for (var i:uint=0; i< labelArray.length; i++) {
	var rb:RadioButton = new RadioButton();

	rb.textField.autoSize=TextFieldAutoSize.LEFT;
	rb.textField.multiline=true;
	rb.textField.wordWrap=true;
	rb.textField.border=true;
	rb.group=rbg;
	rb.label=labelArray[i];
	
	// 設定したいrbの幅
	rb.width=600;
	rb.textField.width=rb.width-33;
	
	// y位置はrb内の文字量の応じて変える
	var rbHeight:int =  rb.textField.height;
	var space:int = 30;
	
	rb.y=i*rbHeight+space;
	addChild(rb);

	if (i==0) {
		trace("tfの幅 : " + rb.textField.width);
		trace("tfの高さ: " + rb.textField.height);
		trace("rbの幅 : " + rb.width);
		trace("--------------------")
	}
}


----------------
永井勝則
Åê¹ÆNo.43878
投稿日時: 2009-11-9 14:46
職人
居住地: 白馬村
投稿: 796
使用環境:
Windows 7 :Flash CS4:
10.6.8 :Flash CS5.5
Re: RadioButton コンポーネントの文字を自動改行させたい
思い切ってRadioButtonのテキストフィールドはやめて、
RadioButtonのボタン部 + TextFieldに代える方法はどうですか？

引用：
もう１つの解決策は、ラジオボタンのラベルを""にして、ラベルがあるはずの場所に新たにテキストフィールドを作成する方法です


----------------
永井勝則：
himco.jp :
flashlite
Åê¹ÆNo.43888
投稿日時: 2009-11-10 3:55
常連
居住地: 東京
投稿: 69
使用環境:
WinXP Win7
Flash CS3,Flash CS5.0

FlashPlayer
FlashLite 1.1、2.0、2.1、3.1(下記)
Docomo SO903i
SH-08A
SoftBank 911T
　922SH
945SHG
au W61SA
S004
Disney DM001SH
Willcom Windows Mobile
　WX341k
Re: RadioButton コンポーネントの文字を自動改行させたい
knagai様
回答ありがとうございます。
代替TextFieldだとTextFieldのロールオーバーやクリックの反応をRadioButtonと連携させる分が
面倒だと思ってましたが、こうなってくるとその方が良さそうですね。

試行錯誤しましたが、下記[1]の部分を外すと
「rb幅が十分なのに納得のいかない改行をされる」が再現され、
[2]を追記した状態で[1]を外すと、今のところ
意図したものだけが、指定幅内で自動改行されています。
（下記で、何の問題も無くなった。と言える自信はありません。）


import fl.controls.RadioButton;
import fl.controls.RadioButtonGroup;


var l1:String="init 0";
var l2:String="init 1";
var l3:String="init ２";
var l4:String="in\nit 1";
var labelArray:Array=[l1,l2,l3,l4];

for (var i:uint=0; i< labelArray.length; i++) {
	var rb:RadioButton = new RadioButton();

	rb.textField.autoSize=TextFieldAutoSize.LEFT;
	rb.textField.multiline=true;
	//[1]自動改行させない。
	//rb.textField.wordWrap=true;
	
	rb.textField.border=true;
	rb.label=labelArray[i];
	// 設定したいrbの幅
	rb.width=60;	

	// y位置はrb内の文字量に応じて変える
	var rbHeight:int =  rb.textField.height;
	var space:int = 20;
	rb.y=i*40+rbHeight+space;
	addChild(rb);
	trace("tfの幅 : " + rb.textField.width);
	
	//[2]対策？tf指定幅を超えていたら改行設定
	if (rb.textField.width >rb.width-30) {
		trace(i);
		rb.textField.wordWrap=true;
		rb.textField.width=rb.width-33;
	}
	trace("--------------------");
}


----------------
スレッド表示 | 新しいものから 前のトピック | 次のトピック | トップ

投稿するにはまず登録を
 
Copyright (C) 2003 FLASH-japan. All rights reserved.
Powered by Xoops