JAVAFX WEBVIEW (“NATION MEDIA RSS VIEWER”)

 JAVAFX WEBVIEW (“NATION MEDIA RSS VIEWER”)

This rss application was adapted from my android and j2me project .Which was basically ListView with a title,description and link.In the javafx application I decided to add an image and use a TilePane as my layout.

In android and javafx  parsing the xml file I used jsoup,and in j2me I used kxml.

MainWindow

Snapshot of nation rss xml file

How to parse the xml file

Example getting title tag,it’s the same for all other tags.

    URL ntv_url=new URL(url);

    Document doc=Jsoup.parse(ntv_url.openStream(), "UTF-8", "",     Parser.xmlParser());

    Elements link=doc.getElementsByTag("link");

    for (Element el:link){

   //add title text to an ObservableList like so observableList.add(el.text());

}

Getting the Images from the links, the link source code snapshot

 String image_url="";

        try {

             Document doc=Jsoup.connect(link).get();    

      

             image_url = doc.select("meta[property=og:image]").get(0).attr("content");

        } catch (IOException ex) { 

            Image_url=”no_pic.png”;

        }

        return image_url;

Displaying the Content

I used a StackPane as my root layout of my cells (“TileCell class”) .Since I want to 

open the WebView on clicking the root,and thereby passing a link to the WebEngine.

I set every TileCell userData to a link.

e.g root.setUserData(link);

 How you load the link.

  WebView browser = new WebView();

  WebEngine webEngine = browser.getEngine();

  webEngine.load(link);

The WebView is show in another Stage.

WebView

On loading the WebView the main stage opacity is set to 0.6   and on closing is set to default that’s 1.0;

         webViewstage.setOnShown(new EventHandler<WindowEvent>(){

                    @Override

                    public void handle(WindowEvent event) {

                      mainStage.setOpacity(0.6);

                    }

                });

    webViewstage.setOnHiding(new EventHandler<WindowEvent>(){

                    @Override

                    public void handle(WindowEvent event) {

                        mainStage.setOpacity(1);

                        webViewstage.close();

                    }

                });

To style the ImageView with rounded corners I created a rectangle with arcHeight and arcWidth set to 20, and called the set clip method in the ImageView.

ImageView im=new ImageView(image);

 im.setId("image");

 im.setFitHeight(240);

 im.setFitWidth(240);

 Rectangle rect=new Rectangle(240,240);

 rect.setArcHeight(20);

 rect.setArcWidth(20);

  im.setClip(rect);

All of the Stages style are set to StageStyle.UNDECORATED ,but still have Buttons that close and minimize with ScaleTransitions and Glow effect the main Stage.The Buttons are then added to a FlowPane .

         Button close=new Button("",new ImageView("file:close.png"));

        close.setId("close_btn");

        Glow glow=new Glow();

        glow.setLevel(0.7);

        close.setEffect(glow);

        close.setOnAction(new EventHandler<ActionEvent>(){

            @Override

            public void handle(ActionEvent event) {

               System.exit(0);

            }

        });          

        Button min=new Button("",new ImageView("file:min.png"));

        min.setId("min_btn");

        min.setEffect(glow);

        min.setOnAction(new EventHandler<ActionEvent>(){

            @Override

            public void handle(ActionEvent event) {

                primaryStage.setIconified(true);

            }   

        });

      

        FlowPane flowPane=new FlowPane();

        flowPane.setId("flowPane");

        flowPane.setHgap(3);

        flowPane.getChildren().addAll(close,min);

        flowPane.setMaxSize(80, USE_PREF_SIZE);

        flowPane.setScaleX(0.5);

        flowPane.setScaleY(0.5);

        flowPane.setOnMouseEntered(new EventHandler<MouseEvent>(){

            @Override

            public void handle(MouseEvent event) {

            st.setDuration(Duration.millis(300));

            st.setNode(flowPane);

            st.setToX(1);

            st.setToY(1);

            st.setByY(0.1);

            st.setByX(0.1);

            st.play();

            }

           

        });

        flowPane.setOnMouseExited(new EventHandler<MouseEvent>(){

            @Override

            public void handle(MouseEvent event) {

                st.setDuration(Duration.millis(300));

                st.setNode(flowPane);

                st.setToX(0.5);

                st.setToY(0.5);

                st.setByY(0.1);

                st.setByX(0.1);

                st.play();    

            }

        });  

Video Sample