在ActionBarSherlock中实现SearchView折叠动画

Question

在ActionBarSherlock中实现SearchView折叠动画

3

我已经成功地将 ActionBarSherlock 集成到我的 Android 项目中。现在，我想在 ActionBar 中添加一个 搜索小部件，并已经成功地完成了这个任务。接下来，我希望在展开时从右侧滑入 Searchview，在折叠时向右滑出。我有两个 XML 动画可以实现这一点。

search_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false" >

<translate
    android:duration="1000"
    android:fromXDelta="100%"
    android:fromYDelta="0%"
    android:toXDelta="0%"
    android:toYDelta="0%" />

</set>

search_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false" >

<translate
    android:duration="700"
    android:fromXDelta="0%"
    android:fromYDelta="0%"
    android:toXDelta="100%"
    android:toYDelta="0%" />

</set>

它们被称为在SherlockFragmentActivity内部的表单

public boolean onCreateOptionsMenu(Menu menu) {
    ...
final SearchView searchView = new SearchView(this.getSupportActionBar().getThemedContext());
    final Animation in = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.search_in);
    final Animation out = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.search_out);

    out.setAnimationListener(new Animation.AnimationListener(){

        @Override
        public void onAnimationEnd(Animation animation) {
            searchView.setIconified(true);

        }

        @Override
        public void onAnimationRepeat(Animation animation) {
            // TODO Auto-generated method stub

        }

        @Override
        public void onAnimationStart(Animation animation) {
            // TODO Auto-generated method stub

        }

    });

     menu.add("Search")
        .setIcon(android.R.drawable.ic_menu_search)
        .setActionView(searchView)
        .setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM);

    final MenuItem searchMenuItem = menu.getItem(0);

    searchView.setQueryHint(getResources().getText(R.string.searchHint));
    searchView.setIconifiedByDefault(true);
    searchView.setOnQueryTextFocusChangeListener(new View.OnFocusChangeListener() {
        @Override
        public void onFocusChange(View view, boolean queryTextFocused) {

            if(!queryTextFocused){
                searchView.startAnimation(out);
                searchMenuItem.collapseActionView();
            }
            else
                searchView.startAnimation(in);
        }
    });
    return super.onCreateOptionsMenu(menu);
}//end onCreateOptionsMenu
}

目前的界面如下所示（由于我不能发布图片...）：

http://i194.photobucket.com/albums/z31/raitono/SearchviewCollapseProblem_zpsefee50e9.gif

当点击图标时，search_in 动画效果非常好，当按下返回键时，search_out 也能正常工作。问题出在我试图通过小 X 收起 Searchview 时。似乎 Searchview 在动画调用之前就已经折叠了，我不知道该怎么办。我也尝试过 searchView.onActionViewCollapsed() ，但没有任何效果。我的猜测是需要拦截当 X 被按下时的调用，并先执行动画。

我正在尝试支持低至 2.3.5 版本的设备。如果您能提供帮助，将不胜感激。

更新：有没有办法检测到当小 'X' 被点击时？那样可以解决我的问题。我一直在谷歌搜索，但还没有找到什么。

- Bpainter

尝试将您的 search_out.xml 更改为

<translate         android:duration="1000"         android:fromXDelta="0%"         android:fromYDelta="0%"         android:toXDelta="200%"         android:toYDelta="0%" />

。 - GrIsHu

当我进行了这个更改后，它的表现方式没有变化。唯一明显的区别是图标移动得更慢了。 - Bpainter

我最近改变了做法。我使用了一个带有编辑文本的自定义视图在操作栏中。然后，我能够通过点击“X”来解决它不起作用的问题，但现在当我使用返回按钮时它不起作用了。 - Bpainter

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Sujith S Manjavana · Accepted Answer

我不确定ActionBarSherlock。但在Android的SearchView小部件中，您可以使用此功能。

searchView = (SearchView) menu.findItem(R.id.action_search)
                .getActionView();
        //Get the ID for the search bar LinearLayout
        int searchBarId = searchView.getContext().getResources().getIdentifier("android:id/search_bar", null, null);
        //Get the search bar Linearlayout
        LinearLayout searchBar = (LinearLayout) searchView.findViewById(searchBarId);
        //Give the Linearlayout a transition animation.
        searchBar.setLayoutTransition(new LayoutTransition());