1<?xml version="1.0" encoding="utf-8"?>
2<!--
3    Copyright (C) 2018 The Android Open Source Project
4
5    Licensed under the Apache License, Version 2.0 (the "License")
6    you may not use this file except in compliance with the License.
7    You may obtain a copy of the License at
8
9        http://www.apache.org/licenses/LICENSE-2.0
10
11    Unless required by applicable law or agreed to in writing, software
12    distributed under the License is distributed on an "AS IS" BASIS,
13    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14    See the License for the specific language governing permissions and
15    limitations under the License.
16-->
17
18<!--
19    NOTE: All panes have the same width. The preference pane and preview pane are merely visual
20    effects achieved by utilizing the overlay. In order to have different paddings for preference
21    pane and preview pane without compromising the smooth scroll animation, we must refrain from
22    flipping visibility between VISIBLE and GONE of extra View elements to use them as paddings.
23
24    Since the preference pane is designed to have larger paddingStart than the preview pane, we
25    achieved the desired visual effect by:
26    (1) Setting paddingStart for all panes (frame1, frame2, ...) to be the desired value of preview
27    pane paddingStart, denoted by Y.
28    (2) Adding two View elements (extra_padding and extra_padding_rtl) both with width denoted by X
29    at the very beginning and end within the TwoPanelScrollView, such that the sum of X and Y equals
30    to the desired value of preference pane visual paddingStart.
31    (3) Always slides the visible window of TwoPanelScrollView from 0 on X-axis by integer increment
32    of preference pane width.
33
34    Here are concrete examples to help us understand:
35    (1) When frame1 is the preference pane, the screen shows extra_padding, frame1 and part of
36    frame2 as preview pane. The combination of extra_padding and frame1's paddingStart consists the
37    visual paddingStart of preference pane.
38    (2) When we navigate to the next pane and frame2 becomes the preference pane, the screen shows a
39    small fraction of frame1's paddingEnd, frame2 and part of frame3 as preview pane. Because we
40    slide the visible window by an increment of preference pane width on X-axis, there will always
41    be exactly X amount of previous pane's blank paddingEnd blending into the real paddingStart of
42    current preference pane to consist the larger visual paddingStart.
43-->
44<com.android.tv.twopanelsettings.TwoPanelSettingsRootView
45    xmlns:android="http://schemas.android.com/apk/res/android"
46    android:id="@+id/two_panel_fragment_container"
47    android:layout_width="match_parent"
48    android:layout_height="match_parent"
49    android:orientation="horizontal"
50    android:background="@color/tp_fragment_container_background_color">
51
52    <com.android.tv.twopanelsettings.TwoPanelScrollView
53        android:id="@+id/scrollview"
54        android:layout_width="@dimen/tp_settings_panes_width"
55        android:layout_height="match_parent"
56        android:scrollbars="none"
57        android:importantForAccessibility="no">
58
59        <LinearLayout
60            android:id="@+id/linearlayout"
61            android:orientation="horizontal"
62            android:layout_width="@dimen/tp_settings_panes_width"
63            android:layout_height="match_parent">
64
65            <!-- extra_padding, the extra paddingStart of preference pane -->
66            <FrameLayout
67                 android:background="@color/tp_preference_panel_background_color"
68                 android:layout_width="@dimen/preference_pane_extra_padding_start"
69                 android:layout_height="match_parent" />
70
71            <FrameLayout
72                android:id="@+id/frame1_container"
73                android:background="@color/tp_preference_panel_background_color"
74                android:layout_width="@dimen/tp_settings_preference_pane_width"
75                android:layout_height="match_parent">
76                <FrameLayout
77                    android:id="@+id/frame1"
78                    android:layout_width="match_parent"
79                    android:layout_height="match_parent"
80                    android:paddingStart="@dimen/pane_basic_padding_start"
81                    android:paddingEnd="@dimen/preference_pane_padding_end" />
82                <FrameLayout
83                    android:id="@+id/frame1_overlay"
84                    android:layout_width="match_parent"
85                    android:layout_height="match_parent"
86                    android:background="@color/tp_preview_panel_overlay_color"
87                    android:alpha="0"
88                    android:focusable="false"/>
89            </FrameLayout>
90
91            <FrameLayout
92                android:id="@+id/frame2_container"
93                android:background="@color/tp_preference_panel_background_color"
94                android:layout_width="@dimen/tp_settings_preference_pane_width"
95                android:layout_height="match_parent">
96                <FrameLayout
97                    android:id="@+id/frame2"
98                    android:layout_width="match_parent"
99                    android:layout_height="match_parent"
100                    android:paddingStart="@dimen/pane_basic_padding_start"
101                    android:paddingEnd="@dimen/preference_pane_padding_end" />
102                <FrameLayout
103                    android:id="@+id/frame2_overlay"
104                    android:layout_width="match_parent"
105                    android:layout_height="match_parent"
106                    android:background="@color/tp_preview_panel_overlay_color"
107                    android:alpha="0"
108                    android:focusable="false"/>
109            </FrameLayout>
110
111            <FrameLayout
112                android:id="@+id/frame3_container"
113                android:layout_width="@dimen/tp_settings_preference_pane_width"
114                android:layout_height="match_parent" >
115                <FrameLayout
116                    android:id="@+id/frame3"
117                    android:layout_width="match_parent"
118                    android:layout_height="match_parent"
119                    android:paddingStart="@dimen/pane_basic_padding_start"
120                    android:paddingEnd="@dimen/preference_pane_padding_end" />
121                <FrameLayout
122                    android:id="@+id/frame3_overlay"
123                    android:layout_width="match_parent"
124                    android:layout_height="match_parent"
125                    android:background="@color/tp_preview_panel_overlay_color"
126                    android:alpha="0"
127                    android:focusable="false"/>
128            </FrameLayout>
129
130            <FrameLayout
131                android:id="@+id/frame4_container"
132                android:background="@color/tp_preference_panel_background_color"
133                android:layout_width="@dimen/tp_settings_preference_pane_width"
134                android:layout_height="match_parent">
135                <FrameLayout
136                    android:id="@+id/frame4"
137                    android:layout_width="match_parent"
138                    android:layout_height="match_parent"
139                    android:paddingStart="@dimen/pane_basic_padding_start"
140                    android:paddingEnd="@dimen/preference_pane_padding_end" />
141                <FrameLayout
142                    android:id="@+id/frame4_overlay"
143                    android:layout_width="match_parent"
144                    android:layout_height="match_parent"
145                    android:background="@color/tp_preview_panel_overlay_color"
146                    android:alpha="0"
147                    android:focusable="false"/>
148            </FrameLayout>
149
150            <FrameLayout
151                android:id="@+id/frame5_container"
152                android:background="@color/tp_preference_panel_background_color"
153                android:layout_width="@dimen/tp_settings_preference_pane_width"
154                android:layout_height="match_parent">
155                <FrameLayout
156                    android:id="@+id/frame5"
157                    android:layout_width="match_parent"
158                    android:layout_height="match_parent"
159                    android:paddingStart="@dimen/pane_basic_padding_start"
160                    android:paddingEnd="@dimen/preference_pane_padding_end" />
161                <FrameLayout
162                    android:id="@+id/frame5_overlay"
163                    android:layout_width="match_parent"
164                    android:layout_height="match_parent"
165                    android:background="@color/tp_preview_panel_overlay_color"
166                    android:alpha="0"
167                    android:focusable="false"/>
168            </FrameLayout>
169
170            <FrameLayout
171                android:id="@+id/frame6_container"
172                android:background="@color/tp_preference_panel_background_color"
173                android:layout_width="@dimen/tp_settings_preference_pane_width"
174                android:layout_height="match_parent" >
175                <FrameLayout
176                    android:id="@+id/frame6"
177                    android:layout_width="match_parent"
178                    android:layout_height="match_parent"
179                    android:paddingStart="@dimen/pane_basic_padding_start"
180                    android:paddingEnd="@dimen/preference_pane_padding_end" />
181                <FrameLayout
182                    android:id="@+id/frame6_overlay"
183                    android:layout_width="match_parent"
184                    android:layout_height="match_parent"
185                    android:background="@color/tp_preview_panel_overlay_color"
186                    android:alpha="0"
187                    android:focusable="false"/>
188            </FrameLayout>
189
190            <FrameLayout
191                android:id="@+id/frame7_container"
192                android:background="@color/tp_preference_panel_background_color"
193                android:layout_width="@dimen/tp_settings_preference_pane_width"
194                android:layout_height="match_parent" >
195                <FrameLayout
196                    android:id="@+id/frame7"
197                    android:layout_width="match_parent"
198                    android:layout_height="match_parent"
199                    android:paddingStart="@dimen/pane_basic_padding_start"
200                    android:paddingEnd="@dimen/preference_pane_padding_end" />
201                <FrameLayout
202                    android:id="@+id/frame7_overlay"
203                    android:layout_width="match_parent"
204                    android:layout_height="match_parent"
205                    android:background="@color/tp_preview_panel_overlay_color"
206                    android:alpha="0"
207                    android:focusable="false"/>
208            </FrameLayout>
209
210            <FrameLayout
211                android:id="@+id/frame8_container"
212                android:background="@color/tp_preference_panel_background_color"
213                android:layout_width="@dimen/tp_settings_preference_pane_width"
214                android:layout_height="match_parent" >
215                <FrameLayout
216                    android:id="@+id/frame8"
217                    android:layout_width="match_parent"
218                    android:layout_height="match_parent"
219                    android:paddingStart="@dimen/pane_basic_padding_start"
220                    android:paddingEnd="@dimen/preference_pane_padding_end" />
221                <FrameLayout
222                    android:id="@+id/frame8_overlay"
223                    android:layout_width="match_parent"
224                    android:layout_height="match_parent"
225                    android:background="@color/tp_preview_panel_overlay_color"
226                    android:alpha="0"
227                    android:focusable="false"/>
228            </FrameLayout>
229
230            <FrameLayout
231                android:id="@+id/frame9_container"
232                android:background="@color/tp_preference_panel_background_color"
233                android:layout_width="@dimen/tp_settings_preference_pane_width"
234                android:layout_height="match_parent" >
235                <FrameLayout
236                    android:id="@+id/frame9"
237                    android:layout_width="match_parent"
238                    android:layout_height="match_parent"
239                    android:paddingStart="@dimen/pane_basic_padding_start"
240                    android:paddingEnd="@dimen/preference_pane_padding_end" />
241                <FrameLayout
242                    android:id="@+id/frame9_overlay"
243                    android:layout_width="match_parent"
244                    android:layout_height="match_parent"
245                    android:background="@color/tp_preview_panel_overlay_color"
246                    android:alpha="0"
247                    android:focusable="false"/>
248            </FrameLayout>
249
250            <FrameLayout
251                android:id="@+id/frame10_container"
252                android:background="@color/tp_preference_panel_background_color"
253                android:layout_width="@dimen/tp_settings_preference_pane_width"
254                android:layout_height="match_parent" >
255                <FrameLayout
256                    android:id="@+id/frame10"
257                    android:layout_width="match_parent"
258                    android:layout_height="match_parent"
259                    android:paddingStart="@dimen/pane_basic_padding_start"
260                    android:paddingEnd="@dimen/preference_pane_padding_end" />
261                <FrameLayout
262                    android:id="@+id/frame10_overlay"
263                    android:layout_width="match_parent"
264                    android:layout_height="match_parent"
265                    android:background="@color/tp_preview_panel_overlay_color"
266                    android:focusable="false"/>
267            </FrameLayout>
268
269            <!-- extra_padding_rtl, the extra paddingStart of preference pane in RTL -->
270            <FrameLayout
271                android:background="@color/tp_preference_panel_background_color"
272                android:layout_width="@dimen/preference_pane_extra_padding_start"
273                android:layout_height="match_parent" />
274
275        </LinearLayout>
276    </com.android.tv.twopanelsettings.TwoPanelScrollView>
277
278</com.android.tv.twopanelsettings.TwoPanelSettingsRootView>
279