Paged change details: Add approvals tab

Change-Id: If19a95b17d061683dddeff502576f840fc28cc31
Signed-off-by: Edwin Kempin <ekempin@google.com>
diff --git a/app/src/main/java/com/google/reviewit/ApprovalsFragment.java b/app/src/main/java/com/google/reviewit/ApprovalsFragment.java
new file mode 100644
index 0000000..2e2a196
--- /dev/null
+++ b/app/src/main/java/com/google/reviewit/ApprovalsFragment.java
@@ -0,0 +1,70 @@
+// Copyright (C) 2016 The Android Open Source Project
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+package com.google.reviewit;
+
+import android.os.Bundle;
+import android.support.annotation.StringRes;
+import android.view.View;
+import android.view.ViewGroup;
+
+import com.google.gerrit.extensions.common.AccountInfo;
+import com.google.reviewit.app.Change;
+import com.google.reviewit.widget.ApprovalEntry;
+import com.google.reviewit.widget.ApprovalsHeader;
+
+import static com.google.reviewit.util.LayoutUtil.matchAndFixedLayout;
+
+public class ApprovalsFragment extends PageFragment {
+  private Change change;
+
+  @Override
+  protected int getLayout() {
+    return R.layout.content_approvals;
+  }
+
+  @Override
+  public @StringRes int getTitle() {
+    return R.string.approvals_title;
+  }
+
+  @Override
+  public void onActivityCreated(Bundle savedInstanceState) {
+    super.onActivityCreated(savedInstanceState);
+
+    ViewGroup approvalList = vg(R.id.approvalList);
+    ApprovalsHeader approvalsHeader = new ApprovalsHeader(getContext());
+    approvalsHeader.init(change);
+    approvalList.addView(approvalsHeader);
+    addSeparator(approvalList);
+    for (AccountInfo account : change.getApprovalData().reviewers) {
+      ApprovalEntry approvalEntry = new ApprovalEntry(getContext());
+      approvalEntry.init(getApp(), change, account);
+      approvalList.addView(approvalEntry);
+      addSeparator(approvalList);
+    }
+  }
+
+  public void setChange(Change change) {
+    this.change = change;
+  }
+
+  private void addSeparator(ViewGroup viewGroup) {
+    View separator = new View(getContext());
+    separator.setLayoutParams(
+        matchAndFixedLayout(widgetUtil.dpToPx(1)));
+    separator.setBackgroundColor(widgetUtil.color(R.color.separator));
+    viewGroup.addView(separator);
+  }
+}
diff --git a/app/src/main/java/com/google/reviewit/PagedChangeDetailsFragment.java b/app/src/main/java/com/google/reviewit/PagedChangeDetailsFragment.java
index ee78ec5..3f311ac 100644
--- a/app/src/main/java/com/google/reviewit/PagedChangeDetailsFragment.java
+++ b/app/src/main/java/com/google/reviewit/PagedChangeDetailsFragment.java
@@ -68,11 +68,15 @@
     fileListFragment.setChange(change);
     fragments.add(fileListFragment);
 
+    ApprovalsFragment approvalsFragment = new ApprovalsFragment();
+    approvalsFragment.setChange(change);
+    fragments.add(approvalsFragment);
+
     ReplyFragment replyFragment = new ReplyFragment();
     replyFragment.setChange(change);
     fragments.add(replyFragment);
 
-    // TODO add more tabs, e.g. for change messages and approvals
+    // TODO add more tabs, e.g. for change messages
 
     ViewPager pager = ((ViewPager) v(R.id.pager));
     pager.setAdapter(
diff --git a/app/src/main/java/com/google/reviewit/util/LayoutUtil.java b/app/src/main/java/com/google/reviewit/util/LayoutUtil.java
index b3993eb..5dc2184 100644
--- a/app/src/main/java/com/google/reviewit/util/LayoutUtil.java
+++ b/app/src/main/java/com/google/reviewit/util/LayoutUtil.java
@@ -18,6 +18,7 @@
 import android.view.View;
 import android.view.ViewGroup;
 import android.view.ViewTreeObserver;
+import android.widget.LinearLayout;
 import android.widget.TableLayout;
 import android.widget.TableRow;
 
@@ -43,6 +44,11 @@
     return new ViewGroup.LayoutParams(width, height);
   }
 
+  public static ViewGroup.LayoutParams fixedLinearLayout(
+      int width, int height) {
+    return new LinearLayout.LayoutParams(width, height);
+  }
+
   public static TableLayout.LayoutParams matchAndWrapTableLayout() {
     return new TableLayout.LayoutParams(
         TableLayout.LayoutParams.MATCH_PARENT,
diff --git a/app/src/main/java/com/google/reviewit/widget/ApprovalEntry.java b/app/src/main/java/com/google/reviewit/widget/ApprovalEntry.java
new file mode 100644
index 0000000..efce0dd
--- /dev/null
+++ b/app/src/main/java/com/google/reviewit/widget/ApprovalEntry.java
@@ -0,0 +1,173 @@
+// Copyright (C) 2016 The Android Open Source Project
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+package com.google.reviewit.widget;
+
+import android.content.Context;
+import android.util.AttributeSet;
+import android.view.Gravity;
+import android.view.View;
+import android.view.ViewGroup;
+import android.widget.ImageView;
+import android.widget.LinearLayout;
+import android.widget.TextView;
+
+import com.google.gerrit.extensions.common.AccountInfo;
+import com.google.gerrit.extensions.common.ApprovalInfo;
+import com.google.gerrit.extensions.common.LabelInfo;
+import com.google.reviewit.R;
+import com.google.reviewit.app.ApprovalData;
+import com.google.reviewit.app.Change;
+import com.google.reviewit.app.ReviewItApp;
+import com.google.reviewit.util.FormatUtil;
+import com.google.reviewit.util.WidgetUtil;
+
+import java.util.Map;
+
+import static com.google.reviewit.util.LayoutUtil.fixedLinearLayout;
+
+public class ApprovalEntry extends LinearLayout {
+  private final WidgetUtil widgetUtil;
+
+  public ApprovalEntry(Context context) {
+    this(context, null, 0);
+  }
+
+  public ApprovalEntry(Context context, AttributeSet attrs) {
+    this(context, attrs, 0);
+  }
+
+  public ApprovalEntry(Context context, AttributeSet attrs, int defStyle) {
+    super(context, attrs, defStyle);
+
+    widgetUtil = new WidgetUtil(context);
+    inflate(context, R.layout.approval_entry, this);
+  }
+
+  public void init(ReviewItApp app, Change change, AccountInfo account) {
+    ((UserView) findViewById(R.id.user)).init(app, account);
+
+    ApprovalData approvalData = change.getApprovalData();
+    ViewGroup approvals = (ViewGroup) findViewById(R.id.approvals);
+
+    for (Map.Entry<String, Map<Integer, ApprovalInfo>> e
+        : approvalData.approvalsByLabel.entrySet()) {
+      String labelName = e.getKey();
+      LabelInfo label = approvalData.labels.get(labelName);
+      View voteView =
+          createVote(account, labelName, label, e.getValue(), approvalData);
+      voteView.setPadding(
+          widgetUtil.dpToPx(2), 0, widgetUtil.dpToPx(2), 0);
+      approvals.addView(voteView);
+    }
+  }
+
+  private View createVote(
+      AccountInfo account,
+      String labelName,
+      LabelInfo label,
+      Map<Integer, ApprovalInfo> approvalsByAccount,
+      ApprovalData approvalData) {
+    if (label.approved != null
+        && label.approved._accountId.equals(account._accountId)) {
+      return createMaxVote(labelName);
+    } else if (label.rejected != null
+        && label.rejected._accountId.equals(account._accountId)) {
+      return createMinVote(labelName);
+    } else {
+      ApprovalInfo approval = approvalsByAccount.get(account._accountId);
+      if (approval != null && approval.value != null) {
+        if (approvalData.isMax(label, approval.value)) {
+          return createMaxVote(labelName);
+        } else if (approvalData.isMin(label, approval.value)) {
+          return createMinVote(labelName);
+        } else {
+          return createNormalVote(labelName, approval.value);
+        }
+      } else {
+        return createNormalVote(labelName, 0);
+      }
+    }
+  }
+
+  private View createNormalVote(String labelName, int value) {
+    if ("Code-Review".equals(labelName)) {
+      if (value == 1) {
+        ImageView image = createImageView();
+        image.setImageDrawable(
+            widgetUtil.getDrawable(
+                R.drawable.ic_sentiment_satisfied_black_18dp));
+        image.setColorFilter(widgetUtil.color(R.color.votingPositive));
+        return image;
+      } else if (value == -1) {
+        ImageView image = createImageView();
+        image.setImageDrawable(
+            widgetUtil.getDrawable(
+                R.drawable.ic_sentiment_dissatisfied_black_18dp));
+        image.setColorFilter(widgetUtil.color(R.color.votingNegative));
+        return image;
+      }
+    }
+    TextView text = widgetUtil.createTextView(
+        FormatUtil.formatLabelValue(value), 18);
+    text.setGravity(Gravity.CENTER_HORIZONTAL);
+    text.setLayoutParams(
+        fixedLinearLayout(widgetUtil.dpToPx(40), widgetUtil.dpToPx(25)));
+    if (value > 0) {
+      text.setTextColor(widgetUtil.color(R.color.votePositive));
+    } else if (value < 0) {
+      text.setTextColor(widgetUtil.color(R.color.voteNegative));
+    } else {
+      text.setText("");
+    }
+    return text;
+  }
+
+  private ImageView createMaxVote(String labelName) {
+    ImageView image = createImageView();
+    if ("Code-Review".equals(labelName)) {
+      image.setImageDrawable(
+          widgetUtil.getDrawable(
+              R.drawable.ic_sentiment_very_satisfied_black_18dp));
+      image.setColorFilter(widgetUtil.color(R.color.votingPositiveSelected));
+    } else {
+      image.setImageDrawable(
+          widgetUtil.getDrawable(R.drawable.ic_done_black_18dp));
+      image.setColorFilter(widgetUtil.color(R.color.votePositive));
+    }
+    return image;
+  }
+
+  private ImageView createMinVote(String labelName) {
+    ImageView image = createImageView();
+    if ("Code-Review".equals(labelName)) {
+      image.setImageDrawable(
+          widgetUtil.getDrawable(
+              R.drawable.ic_sentiment_very_dissatisfied_black_18dp));
+      image.setColorFilter(widgetUtil.color(R.color.votingNegativeSelected));
+    } else {
+      image.setImageDrawable(
+          widgetUtil.getDrawable(R.drawable.ic_clear_black_18dp));
+      image.setColorFilter(widgetUtil.color(R.color.voteNegative));
+    }
+    return image;
+  }
+
+  private ImageView createImageView() {
+    ImageView imageView = new ImageView(getContext());
+    imageView.setLayoutParams(
+        fixedLinearLayout(widgetUtil.dpToPx(40), widgetUtil.dpToPx(25)));
+    return imageView;
+  }
+}
diff --git a/app/src/main/java/com/google/reviewit/widget/ApprovalsHeader.java b/app/src/main/java/com/google/reviewit/widget/ApprovalsHeader.java
new file mode 100644
index 0000000..4c5d473
--- /dev/null
+++ b/app/src/main/java/com/google/reviewit/widget/ApprovalsHeader.java
@@ -0,0 +1,63 @@
+// Copyright (C) 2016 The Android Open Source Project
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+package com.google.reviewit.widget;
+
+import android.content.Context;
+import android.graphics.Typeface;
+import android.util.AttributeSet;
+import android.view.Gravity;
+import android.view.ViewGroup;
+import android.widget.LinearLayout;
+import android.widget.TextView;
+
+import com.google.reviewit.R;
+import com.google.reviewit.app.Change;
+import com.google.reviewit.util.FormatUtil;
+import com.google.reviewit.util.WidgetUtil;
+
+import static com.google.reviewit.util.LayoutUtil.fixedLinearLayout;
+
+public class ApprovalsHeader extends LinearLayout {
+  private final WidgetUtil widgetUtil;
+
+  public ApprovalsHeader(Context context) {
+    this(context, null, 0);
+  }
+
+  public ApprovalsHeader(Context context, AttributeSet attrs) {
+    this(context, attrs, 0);
+  }
+
+  public ApprovalsHeader(Context context, AttributeSet attrs, int defStyle) {
+    super(context, attrs, defStyle);
+
+    widgetUtil = new WidgetUtil(context);
+    inflate(context, R.layout.approvals_header, this);
+  }
+
+  public void init(Change change) {
+    for (String labelName : change.getApprovalData().labels.keySet()) {
+      TextView text = widgetUtil.createTextView(
+          FormatUtil.formatLabelName(labelName), 18);
+      text.setTypeface(null, Typeface.BOLD);
+      text.setGravity(Gravity.CENTER_HORIZONTAL);
+      text.setLayoutParams(
+          fixedLinearLayout(widgetUtil.dpToPx(40), widgetUtil.dpToPx(25)));
+      text.setPadding(
+          widgetUtil.dpToPx(2), 0, widgetUtil.dpToPx(2), 0);
+      ((ViewGroup) findViewById(R.id.labels)).addView(text);
+    }
+  }
+}
diff --git a/app/src/main/res/drawable-hdpi/ic_sentiment_dissatisfied_black_18dp.png b/app/src/main/res/drawable-hdpi/ic_sentiment_dissatisfied_black_18dp.png
new file mode 100644
index 0000000..d29157c
--- /dev/null
+++ b/app/src/main/res/drawable-hdpi/ic_sentiment_dissatisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-hdpi/ic_sentiment_satisfied_black_18dp.png b/app/src/main/res/drawable-hdpi/ic_sentiment_satisfied_black_18dp.png
new file mode 100644
index 0000000..385a21b
--- /dev/null
+++ b/app/src/main/res/drawable-hdpi/ic_sentiment_satisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-hdpi/ic_sentiment_very_dissatisfied_black_18dp.png b/app/src/main/res/drawable-hdpi/ic_sentiment_very_dissatisfied_black_18dp.png
new file mode 100644
index 0000000..4529e89
--- /dev/null
+++ b/app/src/main/res/drawable-hdpi/ic_sentiment_very_dissatisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-hdpi/ic_sentiment_very_satisfied_black_18dp.png b/app/src/main/res/drawable-hdpi/ic_sentiment_very_satisfied_black_18dp.png
new file mode 100644
index 0000000..bc44158
--- /dev/null
+++ b/app/src/main/res/drawable-hdpi/ic_sentiment_very_satisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-mdpi/ic_sentiment_dissatisfied_black_18dp.png b/app/src/main/res/drawable-mdpi/ic_sentiment_dissatisfied_black_18dp.png
new file mode 100644
index 0000000..4547d5d
--- /dev/null
+++ b/app/src/main/res/drawable-mdpi/ic_sentiment_dissatisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-mdpi/ic_sentiment_satisfied_black_18dp.png b/app/src/main/res/drawable-mdpi/ic_sentiment_satisfied_black_18dp.png
new file mode 100644
index 0000000..e38d5f2
--- /dev/null
+++ b/app/src/main/res/drawable-mdpi/ic_sentiment_satisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-mdpi/ic_sentiment_very_dissatisfied_black_18dp.png b/app/src/main/res/drawable-mdpi/ic_sentiment_very_dissatisfied_black_18dp.png
new file mode 100644
index 0000000..c143f5f
--- /dev/null
+++ b/app/src/main/res/drawable-mdpi/ic_sentiment_very_dissatisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-mdpi/ic_sentiment_very_satisfied_black_18dp.png b/app/src/main/res/drawable-mdpi/ic_sentiment_very_satisfied_black_18dp.png
new file mode 100644
index 0000000..50a1fff
--- /dev/null
+++ b/app/src/main/res/drawable-mdpi/ic_sentiment_very_satisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-xhdpi/ic_sentiment_dissatisfied_black_18dp.png b/app/src/main/res/drawable-xhdpi/ic_sentiment_dissatisfied_black_18dp.png
new file mode 100644
index 0000000..636cdc9
--- /dev/null
+++ b/app/src/main/res/drawable-xhdpi/ic_sentiment_dissatisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-xhdpi/ic_sentiment_satisfied_black_18dp.png b/app/src/main/res/drawable-xhdpi/ic_sentiment_satisfied_black_18dp.png
new file mode 100644
index 0000000..3fa9593
--- /dev/null
+++ b/app/src/main/res/drawable-xhdpi/ic_sentiment_satisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-xhdpi/ic_sentiment_very_dissatisfied_black_18dp.png b/app/src/main/res/drawable-xhdpi/ic_sentiment_very_dissatisfied_black_18dp.png
new file mode 100644
index 0000000..777b847
--- /dev/null
+++ b/app/src/main/res/drawable-xhdpi/ic_sentiment_very_dissatisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-xhdpi/ic_sentiment_very_satisfied_black_18dp.png b/app/src/main/res/drawable-xhdpi/ic_sentiment_very_satisfied_black_18dp.png
new file mode 100644
index 0000000..ba95a54
--- /dev/null
+++ b/app/src/main/res/drawable-xhdpi/ic_sentiment_very_satisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-xxhdpi/ic_sentiment_dissatisfied_black_18dp.png b/app/src/main/res/drawable-xxhdpi/ic_sentiment_dissatisfied_black_18dp.png
new file mode 100644
index 0000000..3f8a1f3
--- /dev/null
+++ b/app/src/main/res/drawable-xxhdpi/ic_sentiment_dissatisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-xxhdpi/ic_sentiment_satisfied_black_18dp.png b/app/src/main/res/drawable-xxhdpi/ic_sentiment_satisfied_black_18dp.png
new file mode 100644
index 0000000..6828dd6
--- /dev/null
+++ b/app/src/main/res/drawable-xxhdpi/ic_sentiment_satisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-xxhdpi/ic_sentiment_very_dissatisfied_black_18dp.png b/app/src/main/res/drawable-xxhdpi/ic_sentiment_very_dissatisfied_black_18dp.png
new file mode 100644
index 0000000..fe5b0f4
--- /dev/null
+++ b/app/src/main/res/drawable-xxhdpi/ic_sentiment_very_dissatisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-xxhdpi/ic_sentiment_very_satisfied_black_18dp.png b/app/src/main/res/drawable-xxhdpi/ic_sentiment_very_satisfied_black_18dp.png
new file mode 100644
index 0000000..647974a
--- /dev/null
+++ b/app/src/main/res/drawable-xxhdpi/ic_sentiment_very_satisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-xxxhdpi/ic_sentiment_dissatisfied_black_18dp.png b/app/src/main/res/drawable-xxxhdpi/ic_sentiment_dissatisfied_black_18dp.png
new file mode 100644
index 0000000..2ed61eb
--- /dev/null
+++ b/app/src/main/res/drawable-xxxhdpi/ic_sentiment_dissatisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-xxxhdpi/ic_sentiment_satisfied_black_18dp.png b/app/src/main/res/drawable-xxxhdpi/ic_sentiment_satisfied_black_18dp.png
new file mode 100644
index 0000000..2773523
--- /dev/null
+++ b/app/src/main/res/drawable-xxxhdpi/ic_sentiment_satisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-xxxhdpi/ic_sentiment_very_dissatisfied_black_18dp.png b/app/src/main/res/drawable-xxxhdpi/ic_sentiment_very_dissatisfied_black_18dp.png
new file mode 100644
index 0000000..0c95baa
--- /dev/null
+++ b/app/src/main/res/drawable-xxxhdpi/ic_sentiment_very_dissatisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/drawable-xxxhdpi/ic_sentiment_very_satisfied_black_18dp.png b/app/src/main/res/drawable-xxxhdpi/ic_sentiment_very_satisfied_black_18dp.png
new file mode 100644
index 0000000..be19a69
--- /dev/null
+++ b/app/src/main/res/drawable-xxxhdpi/ic_sentiment_very_satisfied_black_18dp.png
Binary files differ
diff --git a/app/src/main/res/layout/approval_entry.xml b/app/src/main/res/layout/approval_entry.xml
new file mode 100644
index 0000000..20025f6
--- /dev/null
+++ b/app/src/main/res/layout/approval_entry.xml
@@ -0,0 +1,48 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!-- Copyright (C) 2016 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License. -->
+
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+  xmlns:app="http://schemas.android.com/apk/res-auto"
+  android:orientation="horizontal"
+  android:layout_width="match_parent"
+  android:layout_height="wrap_content">
+
+  <TableLayout
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:paddingLeft="3dp"
+    android:paddingTop="3dp"
+    android:paddingRight="3dp"
+    android:paddingBottom="3dp"
+    android:stretchColumns="0"
+    android:shrinkColumns="0">
+    <TableRow>
+      <com.google.reviewit.widget.UserView
+        android:id="@+id/user"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:textSize="18sp"
+        app:avatarSize="25dp"/>
+
+      <LinearLayout
+        android:id="@+id/approvals"
+        android:orientation="horizontal"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content">
+      </LinearLayout>
+    </TableRow>
+  </TableLayout>
+</LinearLayout>
diff --git a/app/src/main/res/layout/approvals_header.xml b/app/src/main/res/layout/approvals_header.xml
new file mode 100644
index 0000000..c0865f5
--- /dev/null
+++ b/app/src/main/res/layout/approvals_header.xml
@@ -0,0 +1,48 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!-- Copyright (C) 2016 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License. -->
+
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+  android:orientation="horizontal"
+  android:layout_width="match_parent"
+  android:layout_height="wrap_content"
+  android:background="@color/approvalsHeader">
+
+  <TableLayout
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:paddingLeft="3dp"
+    android:paddingTop="3dp"
+    android:paddingRight="3dp"
+    android:paddingBottom="3dp"
+    android:stretchColumns="0"
+    android:shrinkColumns="0">
+    <TableRow>
+      <TextView
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:text="@string/reviewers"
+        android:textSize="18sp"
+        android:textStyle="bold"/>
+
+      <LinearLayout
+        android:id="@+id/labels"
+        android:orientation="horizontal"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content">
+      </LinearLayout>
+    </TableRow>
+  </TableLayout>
+</LinearLayout>
diff --git a/app/src/main/res/layout/content_approvals.xml b/app/src/main/res/layout/content_approvals.xml
new file mode 100644
index 0000000..02b7ae3
--- /dev/null
+++ b/app/src/main/res/layout/content_approvals.xml
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!-- Copyright (C) 2016 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License. -->
+
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+  android:orientation="vertical"
+  android:layout_width="match_parent"
+  android:layout_height="match_parent">
+
+  <ScrollView
+    android:id="@+id/scrollView"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <LinearLayout
+      android:id="@+id/approvalList"
+      android:orientation="vertical"
+      android:layout_width="match_parent"
+      android:layout_height="wrap_content">
+    </LinearLayout>
+  </ScrollView>
+</LinearLayout>
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
index dd38d9a..7f77be6 100644
--- a/app/src/main/res/values/colors.xml
+++ b/app/src/main/res/values/colors.xml
@@ -16,6 +16,7 @@
 
 <resources>
   <color name="abandoned">#B1B3AF</color>
+  <color name="approvalsHeader">#f4f4f4</color>
   <color name="black">#000000</color>
   <color name="button">#4183ff</color>
   <color name="buttonBorder">#8699B3</color>
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 9bf157e..d512166 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -256,6 +256,9 @@
   <!-- FileListFragment -->
   <string name="file_list_title">Files</string>
 
+  <!-- ApprovalsFragment -->
+  <string name="approvals_title">Approvals</string>
+
   <!-- ReplyFragment -->
   <string name="reply_title">Reply</string>