JavaFX UI组件和多媒体 UML图（全）

Posted 2022-12-06 nufe_wwt

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaFX UI组件和多媒体 UML图（全）相关的知识，希望对你有一定的参考价值。

JavaFX UI组件和多媒体 UML图

1.Labeled 和标签 Label
2.按钮 Button
3.复选框 CheckBox
4.单选按钮 RadioButton
5.文本域 TextField
6.文本区域 TextArea
7.组合框 ComboBox
8.列表视图 ListView
9.滚动条 ScrollBar
10.滑动条 Slider
11.一些题目
12.其他知识点
13.补充：视频和音频MediaView和MediaPlayer

1.Labeled 和标签 Label

javafx.scene.control.Labeled
-alignment: ObjectProperty<Pos>	指定labeled中文本和结点的对齐方式
-contentDisplay: ObjectProperty<ContentDisplay>	使用ContentDisplay中定义的常量TOP、BOTTOM、LEFT和RIGHT指定结点相对于文本的位置
-graphic: ObjectProperty<Node>	用于labeled的图形
-graphicTextGap: DoubleProperty	图形和文本之间的间隔
-textFill: ObjectProperty<Paint>	用于填充文本的图画
-text: StringProperty	用于标签的文本
-underline: BooleanProperty	文本是否要加下划线
-wrapText: BooleanProperty	如果文本超过了宽度，是否要换至下一行

javafx.scene.control.Label	extends Labeled
+Label()	创建一个空的Label
+Label(text: String)	创建一个特定文本的标签
+Label(text: String, graphic: Node)	创建一个特定文本和图形的标签

2.按钮 Button

javafx.scene.control.ButtonBase	extends Labeled
-onAction: ObjectProperty<EventHandler<ActionEvent>>	定义一个处理按钮动作的处理器

javafx.scene.control.Button	extends ButtonBase
+Button()	创建一个空按钮
+Button(text: String)	创建一个具有给定文本的按钮
+Button(text:String, graphic: Node)	创建一个具有给定文本和图片的按钮

3.复选框 CheckBox

javafx.scene.control.ButtonBase	extends Labeled
-onAction: ObjectProperty<EventHandler<ActionEvent>>	定义一个处理按钮动作的处理器

javafx.scene.control.CheckBox	extends ButtonBase
-selected: BooleanProperty	标识一个复选框是否被选中
———————————————	——————————
+CheckBox()	创建一个空的复选框
+CheckBox(text: String)	创建一个具有特定文本的复选框

4.单选按钮 RadioButton

javafx.scene.control.ToggleButton
-selected: BooleanProperty	表明按钮是否被选中
-toggleGroup: ObjectProperty<ToggleGroupe>	表明按钮属于的按钮组
————————————————————	——————————
+ToggleGroup()	创建一个空开关按钮
+ToggleGroup(text: String)	创建一个具有指定文本的按钮
+ToggleGroup(text: String, graphic: Node)	创建一个具有指定文本和图片的按钮

javafx.scene.control.RadioButton	extends ToggleButton
+RadioButton()	创建一个空的单选按钮
+RadioButton(text: String)	创建一个具有指定文本的单选按钮

5.文本域 TextField

javafx.scene.control.TextInputControl
-text: StringProperty	该组件中的文本内容
-editable: BooleanProperty	表明该文本是否可以被用户编辑

javafx.scene.control.TextField	extends TextInputControl
-alignment: ObjectProperty<Pos>	指定文本早文本域中如何对齐
-preColumnCount: IntegerProperty	指定文本域优先列数
-onAction: ObjectProperty<EventHanddler<ActionEvent>>	指定文本域上动作时间的处理器
——————————————————————	——————————
+TextField()	创建一个空的文本域
+TextField(text: String)	创建一个具有指定文本的文本域

6.文本区域 TextArea

javafx.scene.control.TextInputControl
-text: StringProperty	该组件中的文本内容
-editable: BooleanProperty	表明该文本是否可以被用户编辑

javafx.scene.control.TextArea	extends TextInputControl
-prefColumnCount: IntegerProperty	指定文本的优先数列
-prefRowCount: IntegerProperty	指定文本的优先行数
-wrapText: BooleanProperty	指定文本是否要折到下一行
————————————————	—————————————
+TextArea()	创建一个空的文本区域
+TextArea(text: String)	创建一个具有指定文本的文本区域

7.组合框 ComboBox

javafx.scene.control.ComboBoxBase<T>
-value: ObjectProperty<T>	在一个组合框中选择的值
-editable: BooleanProperty	指定组合框是否允许用户输入
-onAction: ObjectProperty<EventHandler<ActionEvent>>	指定动作处理事件的处理器

javafx.scene.control.ComboBox<T>	extends ComboBoxBase<T>
-items: ObjectProperty<ObservableList<T>>	在组合框弹出的条目
-visibleRowCount: IntegerProperty	组合框弹出部分最多可以显示的条目行数
————————————————————	——————————————————
+ComboBox()	创建一个空的组合框
+ComboBox(items: ObservableList<T>)	创建一个具有指定条目的组合框

8.列表视图 ListView

javafx.scene.control.ListView<T>
-items: ObjectProperty<ObservableList<T>>	列表视图中的条目
-orientation: ObjectProperty<Orientation>	指明条目在列表视图中是水平还是垂直显示
-selectionModel: ObjectProperty<MultipleSelectionModel<T>>	指定条目是如何被选定的，SelectionModel还用于获得选择的条目
————————————————————————————	——————————
+ListView()	创建一个空的列表视图
+ListView(items: ObservableList<T>)	创建一个指定条目的列表视图

9.滚动条 ScrollBar

javafx.scene.control.ScrollBar
-blockIncrement: DoubleProperty	单击滚动条轨道时的调节值（默认值：10）
-max: DoubleProperty	滚动条代表的最大值（默认值：100）
-min: DoubleProperty	滚动条代表的最小值（默认值：0）
-unitIncrement: DoubleProperty	当increment()和decrement()方法被调用时对滚动条的调节值
-value: DoubleProperty	滚动条的当前值（默认值：0）
-visibleAmount: DoubleProperty	滚动条的宽度（默认值：15）
-orientation: ObjectProperty<Orientation>	指定滚动条的方向（默认值：HORIZONTAL）
————————————————	————————————————————
+ScrollBar()	创建一个默认的水平滚动条
+increment()	以unitIncrement值增加的滚动条的值
+decrement()	以unitIncrement值减少的滚动条的值

10.滑动条 Slider

javafx.scene.control.Slider
-blockIncrement: DoubleProperty	单击滚动条轨道时的调节值（默认值：10）
-max: DoubleProperty	滚动条代表的最大值（默认值：100）
-min: DoubleProperty	滚动条代表的最小值（默认值：0）
-value: DoubleProperty	滚动条的当前值（默认值：0）
-orientation: ObjectProperty<Orientation>	指定滚动条的方向（默认值：HORIZONTAL）
-majorTickUnit: DoubleProperty	主刻度之间的单位距离
-minorTickUnit: IntegerProperty	两个主刻度之间放置的次刻度数
-showTickLabels: BooleanProperty	指定是否显示刻度标签
-showTickMarks: BooleanProperty	指定是否显示刻度
——————————————————	———————————————————
+Slider()	创建一个默认的水平滑动条
+Slider(min: double, max: double, value: double)	创建一个具有指定min、max和值的滑动条

11.一些题目

1.如何判断一个单选按钮是否被选中？
	rb.isSelected()
	
2.可以为单选按钮的graphic属性设置任何节点吗？
	可以
	
3.如何将单选按钮分组？
	ToggleGroup tg = new ToggleGroup;
	rb1.setToggleGroup(tg);
	rb2.setToggleGroup(tg);
	rb3.setToggleGroup(tg);
	
4.可以将文本域的graphic属性设置为一个节点吗？
	通过Eclipse的自动补全，我认为TextField没有graphic属性

5.如何将文本域中的文本设置为右对齐？
	tf.setAlignment(Pos.RIGHT);

6.如何创建一个具有10行、20列的文本区域？
	ta.setPrefRowCount(10);
	ta.setPrefColumnCount(20);

7.如何创建一个组合框并加入三个条目？
	String[] flags = "1", "2" ,"3"
	ComboBox<String> cbo = new ComboBox<>();
	ObservableList<String> items = 
		FX.Collections.observableArrayList(flags);
	cbo.getItems().addAll(items);

8.如何从组合框中获取一个条目？如何从一个组合框中获取一个选中条目？
	cbo.getItems();
	cbo.getValue();

9.如何得到一个组合框中的条目数？如何获得组合框中一个指定索引号的条目？
	cbo.getItems().size();
	cbo.getItems().get(index);
10.当选择一个新的条目时，ComboBox将触发什么事件？
	ActionEvent

11.如何创建一个具有一个字符串数组的可视列表？
	ObservableList<String> items = 
		FXColloctions.observableArrayList("item1", "item2", "item3" ,"item4")

12.如何设置一个列表视图方向？
	lv.setOrientation(Orientation.HORIZONTAL[VERTICAL]);

13.列表视图的两种模式分别是？
	设置单选模式（默认）：
		lv.getSelectedModel().setSelectedMode(SelectedMode.SINGLE);
	设置多选模式：
		lv.getSelectedModel().setSelectedMode(SelectedMode.MUTIPLE);

14.如何获得选中的条目以及选中的下标？(单选和多选)
	lv.getSelectionModel().getSelectedItem();
	lv.getSelectionModel().getSelectedIndex();
	lv.getSelectionModel().getSelectedItems();
	lv.getSelectionModel().getSelectedIndices();

15.如何编写代码，用以响应滚动条的value属性的改变？(滑动条同)
	sb.valueProperty().addListener(new InvalidationListener()
		public void invalidated(Observable ov)
			//code block
		
	);
	等同于
	sb.valueProperty().addListener(ov -> //code block);

12.其他知识点

1.ContentDisplay可以理解成节点（例如图形）相对于文本的位置
2.property都实现了observable
3.pref->prefrence 优先
4.TextField 有prefColumnCount属性，因为是一行，所以只有优先列数
5.如果一个文本域（TextField）用于输入密码，使用PasswordField来代替TextField。PasswordField继承自TextField,将输入文本隐藏为回显字符******。
6.TextArea提供滚动支持，但是TextArea在没有超出行（列）数时不会显示行（列）滚动条；但是ScrollPane会一直显示。当文本内容是不可编辑并且内容长时最好使用ScrollPane封装一下（比如小说）。可编辑的文本最好用直接TextField。
7.组合框也成为选择列表或下拉式列表。
8.ComboBox可以触发一个ActionEvent事件。当一个条目被选中时，一个ActionEvent时间被触发。Observable是java.util.List的子接口。所以可以将定义在List中的所有方法应用在Observable。为了方便，JavaFX提供了一个静态方法FXColloctions.observableArrayList(arrayOfElements) 来从一个元素数组中创建一个ObservableList。
9.SelectionModel 不仅用于指定条目是如何被选定的，还用于获得选择的条目。（借鉴11.14）
10.index->indices(复数)
11.垂直滚动条（ScrollBar）的值是从上向下增加的，但是垂直滑动条（Slider）的值是从下往上增加的。

13.补充：视频和音频MediaView和MediaPlayer

Media代表一个媒体源，如一段视频或者音频

javafx.scene.media.Media
-duration：ReadOnlyObjectProperty<Duration>	源媒体以秒计时的持续时间
-width：ReadOnlyObjectProperty	源媒体以像素为单位的宽度
-height：ReadOnlyObjectProperty	源媒体以像素为单位的高度
————————————————	—————————————
+Media(source：String)	从一个URL源构建一个Media对象

MediaPlayer播放和控制一个媒体

javafx.scene.media.MediaPlayer	extends Media
-autoPlay：BooleanProperty	指定一个播放是否应该自动开始
-currentCount：ReadOnlyIntegerProperty	已经完成的循环重放数
-cycleCount：IntegerProperty	指定媒体播放的次数
-mute：BooleanProperty	指定音频是否静音
-volume：DoubleProperty	音频的音量
-totalDuration：ReadOnlyObjectProperty<Duration>	从开始到结束播放媒体的持续时间
————————————————	—————————————
+MediaPlayer(media：Media)	为指定媒体创建一个播放器
+play()：void	播放媒体
+pause()：void	暂停媒体播放
+seek()：void	将播放器定位到一个新的重新播放时间点

MediaView提供观看媒体的属性

javafx.scene.media.MediaView	extends Media
-x：DoubleProperty	指定媒体视图的当前x坐标
-y：DoubleProperty	指定媒体视图的当前y坐标
-mediaPlayer：ObjectProperty<MediaPlayer>	为视图媒体指定一个媒体播放器
-fitWidth：DoubleProperty	为媒体视图指定一个合适的视图宽度
-fitHeight：DoubleProperty	为媒体视图指定一个合适的视图高度
————————————————	—————————————
+MediaView()	构建一个空的媒体视图
+MediaView(mediaPlayer：MediaPlayer)	构建一个具有指定媒体播放器的媒体视图