[android开发之内容更新类APP]四、项目的基本功能之布局(续)

来源：互联网发布：web后端性能优化编辑：程序博客网时间：2024/06/05 09:44

昨天才拿到电脑，不说了，都是泪

http://joveth.github.io/funny/

1.选项卡的滑动效果

要知道，用这个选项卡就是想让它滑动起来，不然的话，我才不喜欢用它呢。

在让他滑动之前，先来说一下上一张的问题，话说，按照设计器下载下来的包，替换到我们的 res之后，我发现，tabhost的选项颜色没有变，在我尝试了各种方法之后，终于，我tm放弃了，好吧，正好找到了这个滑动效果的demo，还有选项卡的颜色切换效果。

话不多说，改进我们的东西吧。

1.修改我们的 acitivity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <TabHost        android:id="@+id/tab_host"        android:layout_width="match_parent"        android:layout_height="match_parent" >        <LinearLayout            android:layout_width="match_parent"            android:layout_height="match_parent"            android:orientation="vertical" >            <TabWidget                android:id="@android:id/tabs"                android:layout_width="match_parent"                android:layout_height="48dp"                android:background="@drawable/tab_widget_bg" />            <android.support.v4.view.ViewPager                android:id="@+id/viewpager"                android:layout_width="match_parent"                android:layout_height="match_parent" />            <!-- 隐藏 -->            <FrameLayout                android:id="@android:id/tabcontent"                android:layout_width="match_parent"                android:layout_height="match_parent"                android:visibility="gone" >                <fragment                    android:id="@+id/fragment_image"                    android:name="com.jov.germany.frame.ImageFrame"                    android:layout_width="match_parent"                    android:layout_height="match_parent" />                <fragment                    android:id="@+id/fragment_text"                    android:name="com.jov.germany.frame.TextFrame"                    android:layout_width="match_parent"                    android:layout_height="match_parent" />                <fragment                    android:id="@+id/fragment_both"                    android:name="com.jov.germany.frame.BothFrame"                    android:layout_width="match_parent"                    android:layout_height="match_parent" />            </FrameLayout>        </LinearLayout>    </TabHost></LinearLayout>

这里面添加了viewpage，还有把FramLayout隐藏了

其中的布局文件：

res/color/tab_widget_text.xml

<?xml version="1.0" encoding="utf-8"?><!-- 标签页tab 文字切换颜色 --><selector xmlns:android="http://schemas.android.com/apk/res/android">        <item android:state_selected="true" android:color="@color/color_orange"/>        <item android:color="#000"/>    </selector>

value/color.xml中添加：

<color name="color_orange">#FF9224</color>

为啥是橘黄，我……如果你不喜欢，百度HTML颜色代码表，找一个你自己的最爱

在来修改我们的 MainAcitivity.java

package com.jov.germany;import java.util.ArrayList;import java.util.List;import android.os.Bundle;import android.support.v4.app.FragmentActivity;import android.support.v4.app.FragmentManager;import android.support.v4.view.PagerAdapter;import android.support.v4.view.ViewPager;import android.support.v4.view.ViewPager.OnPageChangeListener;import android.view.Menu;import android.view.MenuItem;import android.view.View;import android.view.ViewGroup;import android.widget.TabHost;import android.widget.TabHost.OnTabChangeListener;import android.widget.TabHost.TabContentFactory;import android.widget.TabHost.TabSpec;import android.widget.TextView;public class MainActivity extends FragmentActivity {public static final String PAGE1_ID = "page1";public static final String PAGE2_ID = "page2";public static final String PAGE3_ID = "page3";private TabHost tabHost; // TabHostprivate List<View> views; // ViewPager内的View对象集合private FragmentManager manager; // Activity管理器private ViewPager pager; // ViewPager@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);// 初始化资源pager = (ViewPager) findViewById(R.id.viewpager);tabHost = (TabHost) findViewById(R.id.tab_host);manager = getSupportFragmentManager();views = new ArrayList<View>();views.add(manager.findFragmentById(R.id.fragment_image).getView());views.add(manager.findFragmentById(R.id.fragment_text).getView());views.add(manager.findFragmentById(R.id.fragment_both).getView());// 管理tabHost开始tabHost.setup();// 传一个空的内容给TabHost，不能用上面两个fragmentTabContentFactory factory = new TabContentFactory() {@Overridepublic View createTabContent(String tag) {return new View(MainActivity.this);}};// tab1TabSpec tabSpec = tabHost.newTabSpec(PAGE1_ID);tabSpec.setIndicator(createTabView(R.string.fragment_image_str));tabSpec.setContent(factory);tabHost.addTab(tabSpec);// tab2TabSpec tabSpec2 = tabHost.newTabSpec(PAGE2_ID);tabSpec2.setIndicator(createTabView(R.string.fragment_text_str));tabSpec2.setContent(factory);tabHost.addTab(tabSpec2);// tab3TabSpec tabSpec3 = tabHost.newTabSpec(PAGE3_ID);tabSpec3.setIndicator(createTabView(R.string.fragment_both_str));tabSpec3.setContent(factory);tabHost.addTab(tabSpec3);tabHost.setCurrentTab(0);// 管理tabHost结束// 设置监听器和适配器pager.setAdapter(new PageAdapter());pager.setOnPageChangeListener(new PageChangeListener());tabHost.setOnTabChangedListener(new TabChangeListener());}/** * PageView Adapter *  * @author Administrator *  */private class PageAdapter extends PagerAdapter {@Overridepublic int getCount() {return views.size();}@Overridepublic boolean isViewFromObject(View arg0, Object arg1) {return arg0 == arg1;}@Overridepublic void destroyItem(ViewGroup view, int position, Object arg2) {view.removeView(views.get(position));}@Overridepublic Object instantiateItem(ViewGroup view, int position) {try {if (views.get(position).getParent() == null) {view.addView(views.get(position));} else {((ViewGroup) views.get(position).getParent()).removeView(views.get(position));view.addView(views.get(position));}} catch (Exception e) {e.printStackTrace();}return views.get(position);}}/** * 标签页点击切换监听器 *  * @author Administrator *  */private class TabChangeListener implements OnTabChangeListener {@Overridepublic void onTabChanged(String tabId) {if (PAGE1_ID.equals(tabId)) {pager.setCurrentItem(0);} else if (PAGE2_ID.equals(tabId)) {pager.setCurrentItem(1);} else if (PAGE3_ID.equals(tabId)) {pager.setCurrentItem(2);} }}/** * ViewPager滑动切换监听器 *  * @author Administrator *  */private class PageChangeListener implements OnPageChangeListener {@Overridepublic void onPageScrollStateChanged(int arg0) {}@Overridepublic void onPageScrolled(int arg0, float arg1, int arg2) {}@Overridepublic void onPageSelected(int arg0) {tabHost.setCurrentTab(arg0);}}/** * 创建tab View *  * @param string * @return */private View createTabView(int stringId) {View tabView = getLayoutInflater().inflate(R.layout.tab, null);TextView textView = (TextView) tabView.findViewById(R.id.tab_text);textView.setText(stringId);return tabView;}@Overridepublic boolean onCreateOptionsMenu(Menu menu) {getMenuInflater().inflate(R.menu.main, menu);return true;}@Overridepublic boolean onOptionsItemSelected(MenuItem item) {int id = item.getItemId();if (id == R.id.action_settings) {return true;}return super.onOptionsItemSelected(item);}}

其中的layout/tab.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    android:background="@drawable/state_tabs_bg" >        <TextView         android:id="@+id/tab_text"        android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:layout_marginTop="11dp"    android:layout_gravity="center_horizontal"    android:textSize="18sp"    android:textColor="@color/tab_widget_text"/></LinearLayout>

drawable/state_tabs_bg.xml

<?xml version="1.0" encoding="utf-8"?><!-- tab每个标签背景 --><selector xmlns:android="http://schemas.android.com/apk/res/android">    <item android:state_selected="true" android:drawable="@drawable/tabs_selected_bg" /> <item android:drawable="@drawable/tabs_normal_bg"></item></selector>

drawable/tabs_selected_bg.xml

<?xml version="1.0" encoding="UTF-8"?><layer-list xmlns:android="http://schemas.android.com/apk/res/android" >    <item>        <shape>            <solid android:color="@color/color_orange" />        </shape>    </item>    <item android:bottom="5dp">        <shape>            <solid android:color="#eeeeee" />        </shape>    </item></layer-list>

drawable/tabs_normal_bg.xml

<?xml version="1.0" encoding="UTF-8"?><layer-list xmlns:android="http://schemas.android.com/apk/res/android" >  <item>        <shape>            <solid android:color="@color/color_orange" />        </shape>    </item>    <item android:bottom="1dp">        <shape>            <solid android:color="#eeeeee" />        </shape>    </item></layer-list>

好至此的话我们的代码算是ok了，但是当你运行的时候却发现跑不起来，为啥呢？？？

且看一下我们的Frame里面，修改ImageFrame.java：

package com.jov.germany.frame;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import com.jov.germany.R;public class ImageFrame extends Fragment{ @Override      public View onCreateView(LayoutInflater inflater, ViewGroup container,              Bundle savedInstanceState) {          return inflater.inflate(R.layout.image_frame, container, false);      }  }

你可能会觉得没什么区别，看一下我们的Fragment引用的包，不一样哦。

好吧，最后MainAcitivity.java中的String内容自己在string.xml里面自己加把

没有截滑动效果。最近各种忙，更新的有点慢，没办法啊

源码这里

0 0