回想起去年做過的一個維語音樂平臺,要求實(shí)現(xiàn)雙語版本瞭恰,漢語和維語。在維語版本中要求文字狱庇、控件惊畏,右對齊顯示,我們都知道大部分語言都是左對齊密任,android默認(rèn)的對齊方式也是左對齊方式颜启。而像維語和阿拉伯語這種語言都是右對齊的,即是從右往左讀的浪讳。
??拿到這個問題我首先想到到的是自定義ViewGroup缰盏。233333~
??其實(shí)從Android 4.2 (api 17)開始 對rtl 提供了相應(yīng)的支持。
項(xiàng)目中的實(shí)際效果
那我們來試一下吧~
相關(guān)配置
- minsdk 大于17
- manifest 文件中添加 android:supportsRtl="true"
- 使用
android:layout_marginEnd=""
android:layout_marginStart=""
android:paddingEnd=""
android:paddingStart=""
簡單使用
- ViewGroup 設(shè)置 android:layoutDirection="rtl 或 trl";
- TextView 內(nèi)文字對齊方式 android:textAlignmen = "textEnd 或 textStart" 或 android:textDirection="rtl 或 ltr"
特別的控件
imageview 右對齊
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleX="-1" //反向
android:src="@drawable/ic_record_voice_over_blue_900_36dp"
/>
viewpager 與 tablayout 右對齊驻债,要求至右往左滑動
public class RTLViewPager extends ViewPager {
// direction
private boolean mIsRtlOriented;
public RTLViewPager(Context context){
this(context, null);
}
public RTLViewPager(Context context, AttributeSet attrs){
super(context, attrs);
}
//rtl 時設(shè)置當(dāng)前頁碼 自定義屬性修改更好
public void setRtlOriented(boolean isRtlOriented){
mIsRtlOriented = isRtlOriented;
if(mIsRtlOriented && getAdapter() != null){
setCurrentItem(getAdapter().getCount() - 1 , false);
}else{
setCurrentItem(0 , false);
}
}
}
設(shè)置 adapter 數(shù)據(jù)反置
public class CommonPagerAdapter extends FragmentStatePagerAdapter
{
private final List<Fragment> mFragments = new ArrayList<>();
private final List<String> mFragmentsTitles = new ArrayList<>();
private boolean mIsRtrl;
public CommonPagerAdapter(FragmentManager fm , boolean mIsRtrl)
{
super(fm);
this.mIsRtrl = mIsRtrl;
}
public void addFragment(Fragment fragment , String title)
{
mFragments.add(fragment);
mFragmentsTitles.add(title);
}
public void clearFragment()
{
mFragments.clear();
mFragmentsTitles.clear();
}
@Override
public Fragment getItem(int position)
{
if (mIsRtrl && mFragments.size() > 0)
{
return mFragments.get(mFragments.size() - position - 1);
}
else
{
return mFragments.get(position);
}
}
@Override
public int getCount()
{
return mFragments.size();
}
@Override
public CharSequence getPageTitle(int position)
{
if (mIsRtrl && mFragmentsTitles.size() > 0)
{
return mFragmentsTitles.get(mFragmentsTitles.size() - position - 1);
}
else
{
return mFragmentsTitles.get(position);
}
}
}
完整布局代碼
漢語布局 activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:orientation="horizontal">
<android.support.design.widget.TabLayout
android:id="@+id/act_tab"
android:layout_width="wrap_content"
android:layout_height="48dp"
app:layout_scrollFlags="scroll"
app:tabSelectedTextColor="#666666"
app:tabTextColor="@android:color/darker_gray"
app:tabIndicatorHeight="2dp"
app:tabMode="scrollable"
app:tabIndicatorColor="@color/colorPrimary">
</android.support.design.widget.TabLayout>
</LinearLayout>
<com.yankang.rtldemo.RTLViewPager
android:id="@+id/act_viewpager"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="0dp">
</com.yankang.rtldemo.RTLViewPager>
<Button
android:id="@+id/change_lang"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/change_lang"/>
</LinearLayout>
維語布局 activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layoutDirection="rtl"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:orientation="horizontal">
<android.support.design.widget.TabLayout
android:id="@+id/act_tab"
android:layout_width="wrap_content"
android:layout_height="48dp"
android:layoutDirection="ltr"
app:layout_scrollFlags="scroll"
app:tabSelectedTextColor="#666666"
app:tabTextColor="@android:color/darker_gray"
app:tabIndicatorHeight="2dp"
app:tabMode="scrollable"
app:tabIndicatorColor="@color/colorPrimary">
</android.support.design.widget.TabLayout>
</LinearLayout>
<com.yankang.rtldemo.RTLViewPager
android:id="@+id/act_viewpager"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="0dp">
</com.yankang.rtldemo.RTLViewPager>
<Button
android:id="@+id/change_lang"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/change_lang"/>
</LinearLayout>
文件夾結(jié)構(gòu)(rtl布局我放在 layout_en_rUS 下)
好吧, 到這里我們基本實(shí)現(xiàn)了雙語版本 形葬, 以及版本的切換合呐。
但是 ,我們layout 多了一份 笙以, String.xml多了一份(這個無法避免)淌实,一方面需要同時維護(hù)兩套布局,布局文件很多的情況下很不方便猖腕,另一方面也增大了app的大小拆祈。
布局優(yōu)化
使用databinding 簡化布局
App字符串常量類 StringVaule.java
package com.yankang.rtldemo.Strings;
import android.databinding.BaseObservable;
import android.databinding.Bindable;
import com.yankang.rtldemo.BR;
/**
* Created by yankang on 2017/1/8.
* app 字符串常量類
*/
public class StringVaule extends BaseObservable
{
private boolean langType = false;
@Bindable
public boolean isLangType() {
return langType;
}
public void setLangType(boolean langType)
{
this.langType = langType;
notifyPropertyChanged(BR.langType);
}
// 文字
public final String btn = "改變";
public final String _btn = "change";
}
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android">
<data>
<import type="com.yankang.rtldemo.Strings.StringVaule"/>
<import type="android.view.View"/>
<variable
name="string"
type="StringVaule"/>
</data>
<LinearLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layoutDirection="@{string.langType ? View.LAYOUT_DIRECTION_RTL : View.LAYOUT_DIRECTION_LTR}"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:orientation="horizontal">
<android.support.design.widget.TabLayout
android:id="@+id/act_tab"
android:layout_width="wrap_content"
android:layout_height="48dp"
app:layout_scrollFlags="scroll"
android:layoutDirection="ltr"
app:tabSelectedTextColor="#666666"
app:tabTextColor="@android:color/darker_gray"
app:tabIndicatorHeight="2dp"
app:tabMode="scrollable"
app:tabIndicatorColor="@color/colorPrimary">
</android.support.design.widget.TabLayout>
</LinearLayout>
<com.yankang.rtldemo.Widgets.RTLViewPager
android:id="@+id/act_viewpager"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="0dp">
</com.yankang.rtldemo.Widgets.RTLViewPager>
<Button
android:id="@+id/change_lang"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@{string.langType ? string._btn : string.btn}"/>
</LinearLayout>
</layout>
RecycleView item list_item.xml
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<data>
<import type="com.yankang.rtldemo.Strings.StringVaule"/>
<import type="com.yankang.rtldemo.Model.Student"/>
<variable
name="string"
type="StringVaule"/>
<variable
name="stu"
type="Student"/>
</data>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_margin="15dp"
android:scaleType="centerCrop"
android:scaleX="@{string.langType ? -1f : 1f}"
app:image="@{stu.imageUrl}"/>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_gravity="center"
android:orientation="vertical"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@{stu.name}"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="@{stu.gender}"/>
</LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginEnd="10dp"
android:scaleX="@{string.langType ? -1f : 1f}"
android:src="@drawable/ic_keyboard_arrow_right_black_36dp"/>
</LinearLayout>
</layout>
MainActivity.java
package com.yankang.rtldemo1;
import android.content.Intent;
import android.databinding.DataBindingUtil;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v7.app.AppCompatActivity;
import com.yankang.rtldemo1.Adapters.CommonPagerAdapter;
import com.yankang.rtldemo1.Widgets.RTLViewPager;
import com.yankang.rtldemo1.data.PreferManager;
import com.yankang.rtldemo1.databinding.ActivityMainBinding;
import butterknife.Bind;
import butterknife.ButterKnife;
import butterknife.OnClick;
import static com.yankang.rtldemo1.App.stringVaule;
public class MainActivity extends AppCompatActivity
{
@Bind(R.id.act_tab)
TabLayout actTab;
@Bind(R.id.act_viewpager)
RTLViewPager actViewpager;
private CommonPagerAdapter adapter;
private boolean isRtl = false;
private ActivityMainBinding binding;
private PreferManager preferManager;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
binding = DataBindingUtil.setContentView(this , R.layout.activity_main);
ButterKnife.bind(this);
initView();
}
private void initView()
{
preferManager = PreferManager.getInstance(this);
binding.setString(App.stringVaule);
isRtl = preferManager.getLangType() == Constant.LANG_EN;
stringVaule.setLangType(isRtl);
adapter = new CommonPagerAdapter(getSupportFragmentManager() , isRtl);
for (int i = 0 ; i < 3 ; i ++)
{
Fragment fragment = new TestFragment();
adapter.addFragment(fragment , "標(biāo)簽" + i);
}
actTab.setupWithViewPager(actViewpager);
actViewpager.setAdapter(adapter);
actViewpager.setRtlOriented(isRtl);
}
@OnClick(R.id.change_lang)
public void change()
{
if (preferManager.getLangType() == Constant.LANG_EN)
{
preferManager.setLangType(Constant.LANG_ZH);
}else
{
preferManager.setLangType(Constant.LANG_EN);
}
startActivity(new Intent(this , MainActivity.class));
finish();
}
}
RecycleView adapter 配置Databinding CommonAdapter.java
package com.yankang.rtldemo.Adapters;
import android.databinding.DataBindingUtil;
import android.databinding.ViewDataBinding;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import com.yankang.rtldemo.App;
import com.yankang.rtldemo.BR;
import com.yankang.rtldemo.Model.Student;
import com.yankang.rtldemo.R;
import java.util.ArrayList;
/**
* Created by yankang on 2017/1/8.
* MVVM 在recycleview 中的應(yīng)用
*/
public class CommonAdapter extends RecyclerView.Adapter<CommonAdapter.ViewHoler>
{
private final ArrayList<Student> mData = new ArrayList<>();
public CommonAdapter(ArrayList<Student> data)
{
mData.addAll(data);
}
@Override
public ViewHoler onCreateViewHolder(ViewGroup parent, int viewType)
{
ViewDataBinding binding = DataBindingUtil.inflate(LayoutInflater
.from(parent.getContext()), R.layout.list_item, parent, false);
ViewHoler holder = new ViewHoler(binding.getRoot());
holder.setViewDataBinding(binding);
return holder;
}
//設(shè)置數(shù)據(jù)
@Override
public void onBindViewHolder(ViewHoler holder, int position)
{
//修改綁定數(shù)據(jù)
holder.getViewDataBinding().setVariable(BR.stu, mData.get(position));
holder.getViewDataBinding().setVariable(BR.string , App.stringVaule);
//刷新
holder.getViewDataBinding().executePendingBindings();
}
@Override
public int getItemCount() {
return mData.size();
}
class ViewHoler extends RecyclerView.ViewHolder{
private ViewDataBinding viewDataBinding;
public ViewHoler(View itemView) {
super(itemView);
}
public ViewDataBinding getViewDataBinding() {
return viewDataBinding;
}
public void setViewDataBinding(ViewDataBinding viewDataBinding) {
this.viewDataBinding = viewDataBinding;
}
}
}
實(shí)際效果
使用DataBinding后,我們不用再維護(hù)多套布局 倘感, 極大的簡化了代碼放坏。總體來說還是很簡單的老玛。
end~