如何使用 SplitViewNavigator 组件在 Flex 中显示主/细节导航 [英] How do I use a SplitViewNavigator component to show Master/Detail navigation in Flex

问题描述

[更新]* * *

我正在为 blackberry playbook 平板电脑构建一个 reddit 应用程序，并且正在使用 reddit 的 API.我有三个 mxml 视图:RedditReaderHomeView.mxml、redditFeed.mxml 和 subredditList.mxml.在 RedditReaderHomeView.mxml 中，我有一个 splitViewNavigator.我的 SplitViewNavigator 左侧是 subredditList.mxml，右侧是 redditFeed.mxml.在初始化时，redditFeed.mxml 拉入 XML 数据以使用 reddit 条目填充其列表，而 subredditList.mxml 拉入 XML 数据，该数据使用 subreddits(类别)填充其列表以显示.当用户点击左侧的 subreddit 条目时，右侧的 redditFeed.mxml 应该更新，以便它提取的数据是来自左侧选择的 subreddit 类别的条目.换句话说，经典的主/细节导航.左侧的类别，在右侧打开该类别的条目.

I am building a reddit app for the blackberry playbook tablet, and am making use of reddit's API. I have three mxml views: RedditReaderHomeView.mxml, redditFeed.mxml, and subredditList.mxml. In RedditReaderHomeView.mxml I have a splitViewNavigator. In left side of my SplitViewNavigator resides subredditList.mxml, and on the right side resides redditFeed.mxml. On initialization, redditFeed.mxml pulls in XML data to populate its list with reddit entries, and subredditList.mxml pulls in XML data which populates its list with subreddits(categories) to display. When a user clicks on of the subreddit entries on the left, the redditFeed.mxml on the right should update so that the data it pulls are entries from the subreddit category that was selected on the left. In other words, classic master/detail navigation. Category on the left, which opens entries of that category on the right.

好吧，我有一个函数可以将所选 subreddit 的 url 传递到 redditFeed.mxml.

Well, I have a function that passes the url of the selected subreddit over to redditFeed.mxml.

subredditList.mxml - 这里选择了一个 subreddit 并将其 url 发送到 redditFeed.mxml 中的一个函数

subredditList.mxml - here a subreddit is selected and its url is sent over to a function in redditFeed.mxml

public function list_clickHandler(event:IndexChangeEvent):void {
                var RSSItem:Object = redditList.dataProvider.getItemAt(event.newIndex);
                var thisItem:Item = RSSItem as Item;
                rlink = thisItem.link;
                var moddedLink:String = rlink.slice(1, int.MAX_VALUE)
                var pushSub:redditFeed = new redditFeed();
                pushSub.myList_creationCompleteHandler(moddedLink);
            }

redditFeed.mxml - url 用于从该特定 subreddit 中获取数据...

redditFeed.mxml - the url is used to grab data from that particular subreddit...

public function myList_creationCompleteHandler(url:String):void
            { 
                getRedditFeedResult.token = redditFeedGrabber.getRedditFeed(url);
            }

...虽然这些数据似乎永远不会显示在 spark List 组件中，即使我可以看到通过网络监视器进行的调用.我花了好几个小时试图解决这个问题.而且我相信这与活动"与停用"的视图有关，因为当我尝试从 redditFeed.mxml 中放置相同的调用时，调用通过并且列表中的数据更新.我想这可能是因为操作是在包含显示数据的列表的同一视图中执行的.因此，在这种情况下，该视图将处于活动状态"，因为该操作正在该视图中执行.

... though this data never seems to be displayed in the spark List component, even though I can see the call being made through the Network Monitor. I've spent hours and hours trying to solve this. And I belive it has something to do with views being 'active' vs. 'deactivated', as when i tried placing this same call from within redditFeed.mxml, the call went through and the data in the list updated. I thought perhaps this was because the action was being performed within the same view that contains the list where the data is displayed. So it would be 'active' in this instance as the action is being performed in that view.

我感谢任何人可以提供的任何帮助.另外，请不要犹豫，向我要求澄清/更多细节.我真的很想解决这个问题.谢谢！

I appreciate any help anyone can offer. Also, dont hesitate to request clarification/more details from me. I reeeallly want to solve this. Thanks!

RedditReaderHomeView.mxml - 这是您请求的代码.让我知道您是否需要更多/其他东西.

RedditReaderHomeView.mxml - Here's the code you requested. Lemme know if you need more/something else.

<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark"
        actionBarVisible="false" tabBarVisible="true" title="Reddit Reader by Domisy" creationPolicy="all"
        actionBarVisible.landscape="true">



    <fx:Script>
        <![CDATA[
            import com.adobe.fiber.core.model_public;
            import mx.events.FlexEvent;
            import views.redditFeed;

            public var defUrl:String = new String("");


            public function refreshRSS(event:Event):void
            {
                          //***UPDATED CODE****
                          var refreshFunction:Object = redditFeedNav.getElementAt(0);
                  refreshFunction.refreshList();


                          //var refreshFunction:redditFeed = new redditFeed();
            //refreshFunction.refreshList();                
            }
        ]]>

    </fx:Script>


    <fx:Declarations>

    </fx:Declarations>



    <s:states>
        <s:State name="portrait"/>
        <s:State name="landscape"/>
    </s:states>




    <s:actionContent>
        <s:Button includeIn="landscape" click="navigator.pushView(profileView)"
                  icon="@Embed('assets/images/profileIcon.png')"/>
    </s:actionContent>




    <s:SplitViewNavigator width="100%" height="100%" id="splitViewNavigator" autoHideFirstViewNavigator="true">
        <s:ViewNavigator id="redditListNav" firstView="views.subredditList" width="300" height="100%"/>
        <s:ViewNavigator id="redditFeedNav" firstView="views.redditFeed" width="100%" height="100%">



            <s:actionContent.landscape>
                <s:Button id="refreshButtonlLandscape" icon="@Embed('assets/refresh160.png')" click="refreshRSS(event)" />
            </s:actionContent.landscape>

            <s:actionContent.portrait>
                <s:Button id="refreshButton" icon="@Embed('assets/refresh160.png')" click="refreshRSS(event)" />
                <s:Button id="navigatorButton" label="Search" click="splitViewNavigator.showFirstViewNavigatorInPopUp(navigatorButton)" />
            </s:actionContent.portrait>
        </s:ViewNavigator>
    </s:SplitViewNavigator>


</s:View>

推荐答案

好的，我明白我认为是什么问题了.您正在创建 redditFeed 对象的一个​​新实例，而不是使用在 MXML 中实例化的实例.在你的 RedditReaderHomeView.mxml 中给 redditFeed 的声明一个 id，然后在上面的函数中使用它:

Okay I see what the problem is I think. You're creating a new instance of the redditFeed object instead of using the one instantiated in MXML. In your RedditReaderHomeView.mxml give the declaration of redditFeed an id, then in the function above use it like:

private var redditFeedId:RedditFeed; //Passed in from RedditReaderHome, bound to the id of the actual one in there
public function list_clickHandler(event:IndexChangeEvent):void {
     var RSSItem:Object = redditList.dataProvider.getItemAt(event.newIndex);
     var thisItem:Item = RSSItem as Item;
     rlink = thisItem.link;
     var moddedLink:String = rlink.slice(1, int.MAX_VALUE)
     redditFeedId.myList_creationCompleteHandler(moddedLink);
 }

如果您最终需要任何帮助，请粘贴到 RedditReaderHome 中.

Paste in RedditReaderHome if you end up needing any help on that.

感谢您的关注 [已添加]

Thanks for following up [ADDED]

        public function refreshRSS(event : Event) : void
        {
            trace(redditFeedNav.getElementAt(0));
            redditFeedNav.getElementAt(0).refreshList(); 
        }

这篇关于如何使用 SplitViewNavigator 组件在 Flex 中显示主/细节导航的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！