2016-06-29 12 views
1

私はViewPagerの中に断片があり、画面の大きさに応じてListViewの高さを動的に変更しようとしています。ここでListViewの高さを変えるとアライメントが失われる

は私のフラグメントのためのXMLコードです:

Fragment.xml

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:paddingBottom="@dimen/activity_vertical_margin" 
    android:paddingLeft="@dimen/activity_horizontal_margin" 
    android:paddingRight="@dimen/activity_horizontal_margin" 
    android:paddingTop="@dimen/activity_vertical_margin"> 

    <RelativeLayout 
     android:id="@+id/rlDiscoveredDevice" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_above="@+id/tvSuggestBTOn"> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/tvDiscoveredDevices" 
      android:layout_alignParentTop="true" 
      android:layout_alignParentStart="true" 
      android:text="@string/text_list_discovered_devices" 
      /> 

     <ProgressBar 
      android:id="@+id/pbDiscoveredDevices" 
      style="?android:attr/progressBarStyleSmall" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_toEndOf="@+id/tvDiscoveredDevices" 
      android:layout_marginStart="16dp" 
      /> 

     <ListView 
      android:id="@+id/lstDiscoveredBTDevices" 
      android:layout_height="250dp" 
      android:layout_width="wrap_content" 
      android:divider="@android:color/transparent" 
      android:dividerHeight="@dimen/list_view_divider_height" 
      android:choiceMode="singleChoice" 
      android:listSelector="@color/list_item_selected" 
      android:layout_below="@+id/tvDiscoveredDevices" 
      android:layout_marginTop="@dimen/list_view_margin_top" 
      /> 

    </RelativeLayout> 

    <ImageButton 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:id="@+id/pairBT" 
     android:background="@drawable/ic_action_down" 
     android:layout_marginStart="134dp" 
     android:layout_below="@+id/rlDiscoveredDevice" 
     android:layout_alignParentStart="true" 
     /> 

    <ImageButton 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:id="@+id/unpairBT" 
     android:background="@drawable/ic_action_up" 
     android:layout_below="@+id/rlDiscoveredDevice" 
     android:layout_toEndOf="@+id/pairBT" 
     android:layout_marginStart="73dp" 
     /> 

    <RelativeLayout 
     android:id="@+id/rlPairedDevice" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_below="@+id/pairBT"> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/tvPairedDevices" 
      android:text="@string/text_list_paired_devices" 
      android:layout_alignParentStart="true" 
      /> 

     <ListView 
      android:id="@+id/lstPairedBTDevices" 
      android:layout_height="wrap_content" 
      android:layout_width="fill_parent" 
      android:divider="@android:color/transparent" 
      android:dividerHeight="@dimen/list_view_divider_height" 
      android:choiceMode="singleChoice" 
      android:listSelector="@color/list_item_selected" 
      android:layout_below="@+id/tvPairedDevices" 
      android:layout_alignParentStart="true" 
      android:layout_marginTop="@dimen/list_view_margin_top" 
      /> 

    </RelativeLayout> 

</RelativeLayout> 

ここで私は、動的に高さを変更するために使用する私のJavaコードです:

DiscoveredDevice.java

public class DiscoveredDevice extends Fragment{ 
    final String TAG = "DiscoverDevice Fragment"; 
    private SharedPreferences appPrefs; 
    private BTActions btActions; 
    private ArrayList<BluetoothDevice> arrDiscoveredDevicesList; 
    private Set<BluetoothDevice> arrPairedDevicesList; 
    private ArrayAdapter<String> btDiscListArrayAdapter; 
    private ArrayAdapter<String> btPairedListArrayAdapter; 
    private String strDiscoveredListItemSelected = ""; 
    private String strPairedListItemSelected = ""; 
    private CommonFunctions cf; 
    private boolean blnIsFragmentLoaded = false; 

    // UI Objects 
    private TextView tvDiscoveredDevices; 
    private TextView tvPairedDevices; 
    private ListView lvDiscoveredList; 
    private ListView lvPairedDevicesList; 
    private ImageButton ibtnPair; 
    private ImageButton ibtnUnPair; 
    private ProgressBar pbDiscDevicesSpinner; 
    private TextView tvSuggestBTOn; 
    private ProgressBar pbLoading; 

    public DiscoveredDevice() { 
     btActions = new BTActions(); 
     cf = new CommonFunctions(); 
    } 

    @Override 
    public void onCreate(Bundle savedInstanceState) { 
     Log.i(TAG, "Begin render of Discovered Device fragment..."); 
     super.onCreate(savedInstanceState); 

     // Define variables 
     appPrefs = this.getActivity().getPreferences(Context.MODE_PRIVATE); 
    } 

    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
          Bundle savedInstanceState) { 
     // Inflate the layout for this fragment 
     return inflater.inflate(R.layout.fragment_discovered_device, container, false); 
    } 

    @Override 
    public void onActivityCreated(Bundle savedInstanceState) { 
     super.onActivityCreated(savedInstanceState); 

     // Define the lists on DiscoveredDevice fragment 
     btDiscListArrayAdapter = new ArrayAdapter<>(getContext(), R.layout.simple_row, R.id.simple_row_Txt); 
     btPairedListArrayAdapter = new ArrayAdapter<>(getContext(), R.layout.simple_row, R.id.simple_row_Txt); 

     // Define UI Objects 
     defineUIObjects(); 

     // Position UI objects 
     positionUIObjects(); 
    } 

    @Override 
    public void setUserVisibleHint(boolean isVisibleToUser) { 
     super.setUserVisibleHint(isVisibleToUser); 
    } 

    private void defineUIObjects() { 
     tvDiscoveredDevices = (TextView) getView().findViewById(R.id.tvDiscoveredDevices); 
     tvPairedDevices = (TextView) getView().findViewById(R.id.tvPairedDevices); 
     lvDiscoveredList = (ListView) getView().findViewById(R.id.lstDiscoveredBTDevices); 
     lvPairedDevicesList = (ListView) getView().findViewById(R.id.lstPairedBTDevices); 
     ibtnPair = (ImageButton) getView().findViewById(R.id.pairBT); 
     ibtnUnPair = (ImageButton) getView().findViewById(R.id.unpairBT); 
     tvSuggestBTOn = (TextView) getView().findViewById(R.id.tvSuggestBTOn); 
     pbDiscDevicesSpinner = (ProgressBar) getView().findViewById(R.id.pbDiscoveredDevices); 

     pbLoading = (ProgressBar) getView().findViewById(R.id.spin_kit_progress); 
     pbLoading.setIndeterminateDrawable(new DoubleBounce()); 
    } 

    private void positionUIObjects() { 
     final ViewGroup vgDiscDevice = (ViewGroup) getView().findViewById(R.id.rlDiscoveredDevice); 
     final AtomicInteger aiLayoutHeight = new AtomicInteger(); 

     Rect rect = new Rect(); 

     // Get the window 
     Window win = getActivity().getWindow(); 
     win.getDecorView().getWindowVisibleDisplayFrame(rect); 

     // Find height of AppBarLayout 
     AppBarLayout ablTabs = (AppBarLayout) getActivity().findViewById(R.id.ablTabs); 

     // Obtain the screen height & width 
     DisplayMetrics metrics = new DisplayMetrics(); 
     getActivity().getWindowManager().getDefaultDisplay().getMetrics(metrics); 
     int intScreenHeight = metrics.heightPixels; 
     int intScreenWidth = metrics.widthPixels; 
     Log.i(TAG, "Actual Screen Height = " + intScreenHeight + " Width = " + intScreenWidth); 

     // Set the height for Discovered Devices list 
     RelativeLayout.LayoutParams rlParams = (RelativeLayout.LayoutParams) getView().findViewById(R.id.rlDiscoveredDevice).getLayoutParams(); 

     // Get height of Discovered Devices relative layout 
     int intDiscoveredDevicesRLHeight = (int)(Math.round((intScreenHeight - rect.top - ablTabs.getMeasuredHeight()) * 0.45)); 
     Log.i(TAG, "Setting the height of Discovered Devices Relative layout as '" + intDiscoveredDevicesRLHeight + "'"); 
     rlParams.topMargin = ablTabs.getMeasuredHeight(); 
     rlParams.leftMargin = 50; // I DID THIS JUST TO CHECK IF THE LEFT MARGIN GETS MOVED TO THE RIGHT. THIS IS WHERE I NEED A BETTER WAY TO PROPERLY ALIGN THE LIST 
     rlParams.height = intDiscoveredDevicesRLHeight; 

     lvDiscoveredList.setLayoutParams(rlParams); 

    } 

各リストが画面の45%を占めるようにしたい(AppBarLaを除くユート)。下のスクリーンショットが表示されたら、新しい高さを設定すると、ListViewの位置がずれて、その一部が画面の左端に表示されます。左マージンを50に設定して、それを表示します。これらは個別に、全体として制御することができるように、私はRelativeLayouts内部2リストビューを配置している

enter image description here

[スクリーンショット]。私はここで何か間違っていますか?

+0

私はあなたのために仕事を投稿しましたか? –

答えて

0

私はこれをxml、動的なサイズ変更なしで実現できると思います!

あなたの記事では、リストビューのそれぞれが利用可能な高さの45%を取るようにしたいと述べました。したがって、私は、画像のビューを含む中心のコンテンツが高さの10%を占めると仮定しています(このアプローチは高さが固定されていても機能しますが、その答えも底に含めます)

すべてトップレベルのレイアウトをLinearLayout(垂直方向)に変更し、LinearLayout(水平方向)にイメージビューを配置し、ビューの高さを変更してlayout_weight属性を2つのRelativeLayoutsに追加する必要があります。ここで注意すべき重要なことは、RelativeLayoutsが今持っているということです

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" 
    android:paddingBottom="@dimen/activity_vertical_margin" 
    android:paddingLeft="@dimen/activity_horizontal_margin" 
    android:paddingRight="@dimen/activity_horizontal_margin" 
    android:paddingTop="@dimen/activity_vertical_margin"> 

    <RelativeLayout 
     android:id="@+id/rlDiscoveredDevice" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_above="@+id/tvSuggestBTOn" 
     android:layout_weight="9"> 

     <TextView 
      android:id="@+id/tvDiscoveredDevices" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_alignParentStart="true" 
      android:layout_alignParentTop="true" 
      android:text="@string/text_list_discovered_devices" 
      /> 

     <ProgressBar 
      android:id="@+id/pbDiscoveredDevices" 
      style="?android:attr/progressBarStyleSmall" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginStart="16dp" 
      android:layout_toEndOf="@+id/tvDiscoveredDevices" 
      /> 

     <ListView 
      android:id="@+id/lstDiscoveredBTDevices" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_below="@+id/tvDiscoveredDevices" 
      android:divider="@android:color/transparent" 
      android:dividerHeight="@dimen/list_view_divider_height" 
      android:choiceMode="singleChoice" 
      android:listSelector="@color/list_item_selected" 
      android:background="@drawable/abc_list_selector_disabled_holo_dark" 
      /> 

    </RelativeLayout> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:gravity="center" 
     android:layout_weight="2"> 

     <ImageButton 
      android:id="@+id/pairBT" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:background="@drawable/ic_action_down" 
      /> 

     <ImageButton 
      android:id="@+id/unpairBT" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:background="@drawable/ic_action_up"/> 
    </LinearLayout> 

    <RelativeLayout 
     android:id="@+id/rlPairedDevice" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="9"> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/tvPairedDevices" 
      android:text="@string/text_list_paired_devices" 
      android:layout_alignParentStart="true" 
      /> 

     <ListView 
      android:id="@+id/lstPairedBTDevices" 
      android:layout_height="match_parent" 
      android:layout_width="match_parent" 
      android:divider="@android:color/transparent" 
      android:dividerHeight="@dimen/list_view_divider_height" 
      android:choiceMode="singleChoice" 
      android:listSelector="@color/list_item_selected" 
      android:layout_below="@+id/tvPairedDevices" 
      android:layout_alignParentStart="true" 
      android:background="@drawable/abc_list_selector_disabled_holo_dark" 
      /> 

    </RelativeLayout> 

</LinearLayout> 

:あなたが作成されます。ここ内部のLinearLayoutは、あなたのXMLがどのように見えるかの例です。それぞれ9の重みを持ち、中央の線形レイアウトの重みは2です。したがって、最上位の線形レイアウトのスペースはその比率で分割され、RelativeLayoutsはそれぞれ45%になり、LinearLayoutは10%になります。

画面の10%を取る代わりに、リニアレイアウトをコンテンツにラップしたい場合(これはお勧めします)、wrap_contentの高さを割り当ててlayout_weight属性を削除することができます。トップレベルのLinearLayoutは、中央のLinearLayoutのスペースを割り当てた後、残りの高さを取り、2つの相対レイアウトの間で均等に分割します。

PS:(ヘッズアップ、おそらく、ここで投稿したxmlを使用することができます。リストビューに背景を設定して、データなしのサイズを簡単に表示できるようにします。

PPS:このアプローチでは、最上位の相対レイアウトで持っていた多くのレイアウト配置属性を削除できます。これにより、コードの清潔さが向上するだけでなく、UIのパフォーマンスが向上します(Relative Layouts are less performant than other view groups, especially when nested)。

+0

Dr. Nitpickこんにちは、お返事ありがとうございます。現在、国外にいる。数週間後にあなたに知らせてくれます。 – AyeVeeKay

+0

安全な旅行計画のようなサウンド! –

+0

きちんとした明確な説明をありがとう。魅力のように動作します。 – AyeVeeKay

関連する問題