頁面切換

JavaFX多個頁面（Stage）之間的切換的實現的基本思路：

構建一個主Stage和多個副Stage頁面（構建方式基本上市一樣的）； 在主Stage中設定某些控制元件的動作，這些動作通過觸發副Stage頁面的stage.show和stage.hide來實現副Stage的開啟和關閉（或者將關閉動作繫結在副Stage的控制元件上）； 主Stage和副Stage之間的資料交換，可以通過在主Stage或副Stage上儲存相應的資料類，通過其進行資料交換（交換動作一般發生在副Stage開啟或關閉的時間）；

這種思路也可以用於實現自定義的彈窗； 帶有資料交換的彈出視窗：

以下是一個示例：      主頁面

1. 【Primary - Controller】
2. publicclassController{
3. @FXMLButton newPage; //彈窗頁面觸發按鈕
4. publicvoid initialize(){
5. //彈出新頁面
6. newPage.setOnAction((ActionEvent e)->{
7. Popup.Data data = Popup.showDialog();//彈出視窗，並獲取交換資料
8. //控制檯列印交換資料
9. System.out.println(data.getId()+"\n"+data.getName()+"\n"
   +data.getCity());
10. });
11. }
12. }

Popup頁面

1. 【Popup-Main】
2. publicclass PopupextendsAnchorPane{
3. privatestaticPopup popup;//本類例項內部封裝在靜態資料域，
4. privateData data ;//對外交換輸出使用的自定義資料結構
5. privateController controller;
6. priavte Stage primaryStage;
7. //本類例項內部封裝在靜態資料域，構造方法私有
8. privatePopup(){
9. try{
10. FXMLLoader fxmlloader =newFXMLloader(getClass
    ().getResource("myDialog.fxml"))
11. Parent root =FXMLLoader.load();
12. primaryStage =newStage();
13. primaryStage.setResizable(false);//固定視窗大小
14. primaryStage.setTitle("Input your message");
15. primaryStage.setScene(newScene(root,300,275));
16. Controller controller = fxmlloader.getControler();
17. controller.start(popup); //傳遞Popup例項物件，同時啟動Controller的按鈕動作繫結
18. }catch(IOException ex){
19. ex.printStackTrace();
20. }
21. }
22. //外部呼叫方法:顯示彈窗，返回資料交換用的資料結構
23. publicstaticData showPopup(){
24. popup =newPopup();
25. if(primaryStage !=null)
26. primaryStage.showAndWait();
27. //顯示彈窗，並中將原執行緒掛起；如果沒有獲取資料的需求，可以直接 primaryStage.show();
28. return popup.getData();
29. }
30. //例項方法：關閉彈窗
31. publicvoid hide(){
32. if(primaryStage !=null)
33. primaryStage.hide();
34. }
35. //例項方法：獲取交換資料
36. publicData getData(){
37. return data;
38. }
39. //對外交換輸出使用的自定義資料結構
40. publicstaticclassData{
41. privateString id;
42. privateString name;
43. privateString city;
44. publicData(){
45. }
46. publicData(String id,String name,String city){
47. this.id = id;
48. this.name = name;
49. this.city = city;
50. }
51. //省略資料域的get、set方法
52. }

1. 【Popup-Controller】
2. publicclassController{
3. @FXMLButton ok;
4. @FXMLButton cancel;
5. @FXMLTextField tfId;
6. @FXMLTextField tfName;
7. @FXMLTextField tfCity;
8. publicvoid initialize(){
9. }
10. publicvoid start（Popup popup）{//獲取Main傳遞迴來的Popup例項
11. //提交按鈕
12. ok.setOnAction((ActionEvent e)->{
13. popup.getData()=newPopup.Date(tfId.getText(),tfName.getText(),tfCity.getText());
14. //儲存交換資料
15. popup.hide();
16. });
17. //取消按鈕
18. cancel.setOnAction((ActionEvent e)->{
19. popup.hide();
20. });
21. }

不帶資料交換的彈出視窗  主頁面

1. 【Primary-Controller】
2. publicclassController{
3. @FXMLButton newPage;//彈窗頁面觸發按鈕
4. publicvoid initialize(){
5. //彈出新頁面
6. newPage.setOnAction((ActionEvent e)->{
7. Popup.showPopup();//彈出視窗
8. Popup.showPopup("hello world");//傳遞引數，並彈出視窗
9. });
10. }
11. }

Popup頁面

1. 【Popup-Main】
2. publicclassPopupextendsAnchorPane{
3. privatestaticPopup popup;
4. privateString param;
5. priavte Stage stage;
6. //構造方法：私有
7. privatePopup(param){
8. this.param = param;
9. try{
10. Parent root =FXMLLoader.load(getClass().getResource("sample.fxml"));
11. Stage stage =newStage();
12. stage.setTitle(engine.getTitle());
13. stage.setScene(newScene(root,800,600));
14. }catch(IOException ex){
15. ......
16. }
17. }
18. priavte Popup(){
19. this("no param");
20. }
21. publicStage getStage(){
22. returnthis.stage;
23. }
24. //外部呼叫方法
25. publicstaticvoid showPopup(String param){
26. popup =newPopup(param);//構造例項
27. popup.getStage().show();//顯示頁面
28. }
29. publicstaticvoid showPopup(){
30. popup =newPopup(param);//構造例項
31. popup.getStage().show();//顯示頁面
32. }
33. }

最簡便方法

1. 呼叫:
2. button.setOnAction(event->{
3. newPopup();
4. });

1. 【Popup-Main】
2. publicclassPopup{
3. publicPopup(){
4. Parent root =FXMLLoader.load(getClass().getResource("sample.fxml"

   相關推薦

   JavaFX：實現頁面切換

   頁面切換 JavaFX多個頁面（Stage）之間的切換的實現的基本思路： 構建一個主Stage和多個副Stage頁面（構建方式基本上市一樣的）； 在主Stage中設定某些控制元件

   FragmentPagerAdaper 實現頁面切換 和 FragmentStatePagerAdapter 實現頁面切換，區別，優缺點，實際開發使用哪種

   Fragment 繼承 v4 包 MyFragmentViewPagerAdapter 這個介面卡並沒有實現頁面銷燬方法，因此，頁面較大，較多，記憶體壓力會比較大 實際開發推薦使用 FragmentStatePagerAdapter 此介面卡 示例效果：

   Unity實戰篇：實現場景切換畫面和進度條

   我們在進行Unity開發時，場景切換是不可避免的。例如MOBA從組隊房間到遊戲場景，MMO傳送，以及吃雞的從素質廣場到荒島，場景的切換勢必要載入大量的資料以及各個模組的初始化工作。那麼，如果要載入的場景過大，而使用者的硬碟或者其他硬體效能不夠強勁，那麼畫面就會卡住，等待很長一段時間，非常影響使用

   JS：實現頁面列印功能

   利用JS實現列印操作 條件：IE瀏覽器的WebBrowser外掛，WebBrowser是IE的內建外掛，只需IE即可開啟，可自動使用外掛 前提：在html程式碼的body標籤下呼叫WebBrowser外掛，程式碼如下 <object id="WebBrowser"

   解決struts2 acton redirect 後不能重新整理的問題 另：實現頁面框架區域性重新整理的方法

   在實際過程中，對message 進行了刪除或者標記已讀的操作後，action 進行redirect ，希望重新進入messaeg 顯示頁面：    <result name="readOrDeleteMessages" type="redirectAction"&g

   音樂網站開發：實現點選按鈕切換頁面背景圖的功能

           最近這一星期在做一個簡單小型的音樂播放器網站，目前各種功能基本都已經實現，包括切換上一曲下一曲，播放與暫停，隨機播放單曲迴圈順序播放模式切換，一首播放完畢自動按模式切換至下一曲，載入單句歌詞及所有歌詞等功能。另外就是本篇部落格要介紹的功能了，點

   底部導航欄實現頁面的切換（一）：Fragment + LinearLayout + TextView

   Fragment + LinearLayout + TextView 實現底部導航欄的切換（一） 知識點 先看效果圖： 專案結構圖： 實現邏輯： 頂部是Linea

   Android實戰簡易教程-第二十六槍（基於ViewPager實現微信頁面切換效果）

   stat addview data android tid des viewpage 聊天 == 1.頭部布局文件top.xml:<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:and

   微信小程序：選項卡頁面切換

   程序 tex oat info === 分享 ndt item dataset 一、功能描述 在同一個頁面內實現不同展示頁面的切換功能，如下圖所示 二、代碼實現 1. index.js Page({ /** * 頁面的初始數據 */ data:

   Linux高性能網絡：協程系列06-協程實現之切換

   type 上下 上下文 函數定義 數據存儲 就是 esp ges linu 目錄 Linux高性能網絡：協程系列01-前言 Linux高性能網絡：協程系列02-協程的起源 Linux高性能網絡：協程系列03-協程的案例 Linux高性能網絡：協程系列04-協程實現之工作原

   例子：實現最新版本Node.js中Express+mongodb的登入註冊頁面

   由於版本差異巨大且不相容的情況下，作為才開始學習Node.js的菜鳥，書籍上的例子是不能看了，因此仿照著網路大神中的例子自己再歸納總結了一遍，方便自己以後檢視。好記性不如爛筆頭嘛。 這裡主要使用的版本是express4.0+mongodb最新版本以及Bootstrap3.0介面所做。 一

   Linux高效能網路：協程系列06-協程實現之切換

   目錄 Linux高效能網路：協程系列01-前言 Linux高效能網路：協程系列02-協程的起源 Linux高效能網路：協程系列03-協程的案例 Linux高效能網路：協程系列04-協程實現之工作原理 Linux高效能網路：協程系列05-協程實現之原語操作 Linux高效能網路：協程

   Vue實現移動端頁面切換效果

   找了好多部落格實現效果都……emmm……   應用Vue自帶的過渡 《 進入/離開 & 列表過渡 》和 巢狀路由 和 fixed定位實現 其實還是挺簡單的。 在子頁面把整個頁面做絕對定位，覆蓋整個螢幕，子父頁面將 router-view 用&n

   element,點選檢視，實現tab切換：

   點選檢視，實現tab切換：   程式碼如下： <template> <div> <el-table :data="tableData" style="width: 100%"> <el-table-colum

   ViewPager+RadioGroup+RadioButton實現滑動切換頁面與點選按鈕切換頁面

   一:效果圖: 二:程式碼: 首先  根據我們有幾個頁面就設定幾個Fragment, 主函式: public class MainActivity extends AppCompatActivity { private ViewPager viewpager;

   Vue系列：滾動頁面到指定位置實現

   bsp 指定 info 平滑滾動 nbsp llb src lint 系列 方法1：scrollTop 滾動到某位置 方法2：scrollTo，scrollBy，scroll滾動到某位置 方法3：scrollIntoView() 實現滾動到具體某元素 需註

   Unity3D實現Tab切換，頁面切換功能

   第一篇部落格，僅作為個人在學習過程中記錄作用 正文 之前公司遇到幾個兩個專案都有一個列表切換的功能，具體功能就是點選tab列表，內容根據tab切換來變換，效果如下： 這樣一個很常見功能 網上例子較少，後來學到一個方法，幾步就可以實現，不需要寫程式碼 第一步 建

   使用BottomTabBar實現底部導航頁(頁面切換)

   開始使用之前先匯入 implementation 'com.hjm:BottomTabBar:1.2.2' 主頁面佈局檔案 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http:

   【微信】運用fragment和viewpage實現主頁面和副頁面切換效果

   這個專案是我自己學習時寫出來的，所以難免有些瑕疵或者種種不足，歡迎各位大佬挑刺，也歡迎其他菜鳥們一起學習。 先放張程式結構圖，大致結構還是比較清晰的 首先可以建好xml佈局檔案，一個主佈局（存放四個切換圖示），四個分佈局fragment 程式碼貼上： `

   web前端實驗一：利用Js捕獲滑鼠事件實現圖片切換

       很多時候在做web時，頭疼的不是功能的實現，而是前臺的介面，下面是介紹關於利用javascript捕獲滑鼠事件的實驗 實驗目的：滑鼠指向某一圖片時，把該圖片切換為指定圖片，離開時回覆原來圖片。 實驗用途：製作web導航、強調某一功能時非常常用。 直接附上原始碼，非