Android平板兼容

1.布局兼容

res文件夹下新建layout-large文件夹(7寸)或者layout-xlarge文件夹(大于7寸),里面的布局文件和layout文件夹的一样.例如activity_main.xml.

假设pad在layout-large和layout-xlarge的布局是这样的:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
tools:context="mchenys.net.csdn.blog.cys_phone_pad.MainActivity">

<FrameLayout
android:id="@+id/layout_left"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>

<FrameLayout
android:id="@+id/layout_right"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"/>
</LinearLayout>

phone的布局是这样的:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="mchenys.net.csdn.blog.cys_phone_pad.MainActivity">

<FrameLayout
android:id="@+id/fl_root"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</RelativeLayout>

注意:layout-large和layout-xlarge的方式有时候不太精确,有时5寸的屏幕也被识别成大屏幕了,怎么解决呢?

可以通过创建layout-sw600dp文件夹来规定屏幕最小宽度必须要大于600dp才能被识别为大屏幕的布局.

如下图所示:



2.代码兼容

通常pad的布局都是有多个FrameLayout或者Fragment的.并且FrameLayout大多数都是用来充当展示Fragment的容器用的.

那么在FragmentActivity的子类中如何才能根据当前的是Pad还是Phone来展示layout下的布局还是layout-large/layout-xlarge下的布局呢?

以上面的布局来说,假设我能获取到id为layout_left或者layout_right的view,不就说明当前的设备是大屏幕设备了吗.因为系统会根据当前设备的尺寸加载不同layout下的布局.

代码如下:

public class MainActivity extends AppCompatActivity {

SettingListFragment listFragment = new SettingListFragment();
SettingDetailFragment detailFragment = new SettingDetailFragment();

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
if (findViewById(R.id.layout_left) != null) {
//说明加载的是layout-large/layout-xlarge的布局
ft.replace(R.id.layout_left, listFragment);//列表
ft.replace(R.id.layout_right, detailFragment);//详情
} else {
//说明加载的是layout下的布局
ft.replace(R.id.fl_root, listFragment);//列表
}
ft.commitAllowingStateLoss();
}
...
}

对于大屏幕来说,如何实现点击左侧列表的内容切换展示右侧的详情fragment呢?

而对于手机来说,点击了列表内容就是要进入到下级页面的,这时又该如何区别对待呢?

还是采用上面的思路,看代码:

/**
* 提供给列表fragment调用,切换展示详情fragment
* @param args 把需要传的参数通过bundle传递
*/
public void showNextPage(Bundle args) {
FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
detailFragment.setArguments(args);
if (findViewById(R.id.layout_left) != null) {
//说明加载的是layout-large/layout-xlarge的布局,显示右侧布局
detailFragment.updateUI(args);
} else {
//说明加载的是layout下的布局,直接进入详情页面
ft.replace(R.id.fl_root, detailFragment);
ft.addToBackStack(null);
}
ft.commitAllowingStateLoss();
}

最后看看列表fragment和详情fragment代码:

/**
* 列表页面
* Created by mChenys on 2017/4/8.
*/
public class SettingListFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment_setting_list, container, false);
}

public void switchPage(View view) {
MainActivity activity = (MainActivity) getActivity();
Bundle args = new Bundle();
args.putString("desc", "列表点击切换详情页啦......");
activity.showNextPage(args);
}
}

/**
* 列表详情页面
* Created by mChenys on 2017/4/8.
*/
public class SettingDetailFragment extends Fragment {
private TextView mTextView;

@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_setting_detail, container, false);
mTextView = (TextView) view.findViewById(R.id.tv_info);
updateUI(getArguments());
return view;
}

/**
* 更新界面
* @param args
*/
public void updateUI(Bundle args) {
if (null != args) {
String detail = args.getString("desc");
mTextView.setText(detail);
}
}
}