Files
photobooth-app/android-project/app/src/main/res/layout/activity_main.xml
T

494 lines
21 KiB
XML

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/theme_bg_dark">
<!-- ================= 1. TOP BAR CONTROL ================= -->
<LinearLayout
android:id="@+id/topBar"
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="@color/theme_bar_bg"
android:orientation="horizontal"
android:gravity="center"
android:paddingHorizontal="16dp"
app:layout_constraintTop_toTopOf="parent">
<ImageButton
android:id="@+id/btnFlash"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@color/theme_transparent"
android:src="@drawable/ic_flash"
app:tint="@color/theme_white"
android:contentDescription="Flash Toggle" />
<Space
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" />
<ImageButton
android:id="@+id/btnTimer"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@color/theme_transparent"
android:src="@drawable/ic_timer"
app:tint="@color/theme_white"
android:contentDescription="Timer Toggle" />
<Space
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" />
<ImageButton
android:id="@+id/btnSwitchCamera"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@color/theme_transparent"
android:src="@drawable/ic_flip_camera"
app:tint="@color/theme_white"
android:contentDescription="Switch Camera" />
</LinearLayout>
<!-- DẢI ĐEN PHÍA TRÊN ẢNH CAMERA (Như mô tả trong image.png) -->
<RelativeLayout
android:id="@+id/layoutEditorTitleBar"
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#000000"
android:visibility="gone"
app:layout_constraintTop_toBottomOf="@id/topBar"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent">
<!-- Văn bản hiển thị động tên nút đang được chọn -->
<TextView
android:id="@+id/tvCurrentAttributeName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Brightness (Độ sáng)"
android:textColor="#FF9800"
android:textSize="14sp"
android:textStyle="bold" />
</RelativeLayout>
<!-- ================= 2. KHUNG FRAME CHÍNH (CAMERA + FILTER + FRAME OVERLAY) ================= -->
<FrameLayout
android:id="@+id/cameraContainer"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#000000"
app:layout_constraintDimensionRatio="3:4"
app:layout_constraintTop_toBottomOf="@id/topBar"
app:layout_constraintBottom_toTopOf="@id/panelSelectionContainer">
<!-- Lớp đáy: Kính ngắm CameraX -->
<androidx.camera.view.PreviewView
android:id="@+id/viewFinder"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<!-- Lớp đè AI: Hiển thị kết quả tách nền thời gian thực -->
<ImageView
android:id="@+id/imgAiPreviewOverlay"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitCenter"
android:visibility="gone"
android:contentDescription="AI Preview Overlay" />
<!-- Lớp đè lọc màu (Filter Overlay): Hiển thị màu Preset cổ điển -->
<ImageView
android:id="@+id/imgFilterOverlay"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitCenter"
android:visibility="gone"
android:contentDescription="Filter Overlay" />
<!-- Lớp phủ tạo nhiễu hạt phim thời gian thực (Dynamic Film Grain Viewfinder Overlay) -->
<com.photobooth.app.FilmGrainView
android:id="@+id/viewFilmGrain"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone" />
<!-- Lớp đè (Overlay): Hiển thị Khung hình PNG do người dùng chọn -->
<ImageView
android:id="@+id/imgFrameOverlay"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitCenter"
android:contentDescription="Frame Overlay" />
<!-- Lớp chớp sáng màn hình khi chụp (Flash Effect) -->
<View
android:id="@+id/viewShutterFlash"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:visibility="gone" />
<!-- Số đếm ngược khi hẹn giờ chụp -->
<TextView
android:id="@+id/txtTimerCountdown"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textColor="@color/theme_white"
android:textSize="100sp"
android:textStyle="bold"
android:shadowColor="@color/theme_panel_dark"
android:shadowDx="4"
android:shadowDy="4"
android:shadowRadius="10"
android:visibility="gone"
android:text="3" />
<!-- Vòng tròn định vị lấy nét (Focus Ring) khi chạm vào Viewfinder -->
<View
android:id="@+id/viewFocusRing"
android:layout_width="60dp"
android:layout_height="60dp"
android:background="@drawable/bg_focus_ring"
android:visibility="gone" />
</FrameLayout>
<!-- ================= KHỐI 1: TIMELINE FRAMES & PRESETS ================= -->
<!-- Đặt ngay phía dưới Camera và không bị ai đè lên nữa -->
<FrameLayout
android:id="@+id/panelSelectionContainer"
android:layout_width="match_parent"
android:layout_height="96dp"
android:background="#000000"
app:layout_constraintTop_toBottomOf="@id/cameraContainer"
app:layout_constraintBottom_toTopOf="@id/bottomControlPanel">
<!-- Danh sách cuộn ngang (Frames / Presets) -->
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rvHorizontalTimeline"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:orientation="horizontal"
android:clipToPadding="false"
android:paddingStart="75dp"
android:paddingEnd="16dp"
android:visibility="gone" />
<!-- Danh sách lựa chọn phông nền AI (Thay thế nền) -->
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rvBackgroundOptions"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:orientation="horizontal"
android:clipToPadding="false"
android:paddingStart="75dp"
android:paddingEnd="16dp"
android:visibility="gone" />
<!-- Thước đo Ruler cho Portrait Blur (Xóa nền) -->
<FrameLayout
android:id="@+id/panelRulerContainer"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_gravity="center_vertical"
android:layout_marginStart="75dp"
android:visibility="gone">
<com.photobooth.app.RulerView
android:id="@+id/panelRulerView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:id="@+id/layoutPanelRulerPointer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center">
<TextView
android:id="@+id/tvPanelRulerValue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:textColor="#FF9800"
android:textSize="12sp"
android:textStyle="bold"
android:layout_gravity="center_horizontal"/>
<ImageView
android:layout_width="12dp"
android:layout_height="12dp"
android:src="@drawable/ic_arrow_down_orange"
android:layout_gravity="center_horizontal"
android:contentDescription="Indicator" />
</LinearLayout>
</FrameLayout>
<!-- Khung nền đen che các item cuộn sang bên trái -->
<View
android:id="@+id/viewLeftDockBackground"
android:layout_width="75dp"
android:layout_height="match_parent"
android:background="#000000"
android:visibility="gone" />
<!-- LỚP TRÊN: Chứa 4 nút chức năng chính (Gốc ở giữa, động chuyển sang trái) -->
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/buttonsWrapper"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Nút Frame -->
<ImageView
android:id="@+id/btnMainFrame"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="@drawable/ic_default_frame_thumbnail"
android:background="@android:color/transparent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="@id/btnMainPreset"
app:layout_constraintHorizontal_chainStyle="packed"
android:layout_marginEnd="12dp"
android:contentDescription="Frame Selector" />
<!-- Nút Presets Màu -->
<ImageView
android:id="@+id/btnMainPreset"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="@drawable/ic_default_preset_thumbnail"
android:background="@android:color/transparent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="@id/btnMainFrame"
app:layout_constraintEnd_toStartOf="@id/btnMainPortraitBlur"
android:layout_marginEnd="12dp"
android:contentDescription="Preset Color Selector" />
<!-- Nút Xóa nền (Portrait Blur) -->
<ImageView
android:id="@+id/btnMainPortraitBlur"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="@drawable/ic_attr_portrait_blur"
android:background="@android:color/transparent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="@id/btnMainPreset"
app:layout_constraintEnd_toStartOf="@id/btnMainBgReplace"
android:layout_marginEnd="12dp"
android:contentDescription="Portrait Blur Selector" />
<!-- Nút Thay nền (BG Replace) -->
<ImageView
android:id="@+id/btnMainBgReplace"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="@drawable/ic_attr_bg_replace"
android:background="@android:color/transparent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="@id/btnMainPortraitBlur"
app:layout_constraintEnd_toEndOf="parent"
android:contentDescription="Background Replace Selector" />
</androidx.constraintlayout.widget.ConstraintLayout>
</FrameLayout>
<!-- ================= KHỐI 2: BOTTOM CONTROL PANEL (ĐIỀU KHIỂN CAMERA) ================= -->
<!-- Khối này gom gọn cả nút Zoom, Shutter và nút Xem ảnh, xóa bỏ các dải nền thừa -->
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/bottomControlPanel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#000000"
app:layout_constraintTop_toBottomOf="@id/panelSelectionContainer"
app:layout_constraintBottom_toBottomOf="parent">
<!-- CỤM ZOOM THUẦN (Xóa bỏ dải nền cũ) -->
<LinearLayout
android:id="@+id/layoutZoomGroup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="12dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<TextView
android:id="@+id/tvZoom05"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0.5x"
android:textColor="#FFFFFF"
android:textStyle="bold"
android:padding="8dp" />
<TextView
android:id="@+id/tvZoom1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1x"
android:textColor="@color/theme_primary"
android:textStyle="bold"
android:padding="8dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp" />
<TextView
android:id="@+id/tvZoom3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="3x"
android:textColor="#FFFFFF"
android:textStyle="bold"
android:padding="8dp" />
</LinearLayout>
<!-- NÚT XEM ẢNH (Biểu tượng Image/Gallery) -->
<ImageButton
android:id="@+id/btnGalleryReview"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:src="@drawable/ic_image_gallery"
app:layout_constraintTop_toTopOf="@id/btnShutterCapture"
app:layout_constraintBottom_toBottomOf="@id/btnShutterCapture"
app:layout_constraintStart_toStartOf="parent"
android:layout_marginStart="32dp"
android:contentDescription="Review Gallery" />
<!-- NÚT SHUTTER CHỤP ẢNH (Viền cam ruột trắng) -->
<ImageButton
android:id="@+id/btnShutterCapture"
android:layout_width="72dp"
android:layout_height="72dp"
android:background="@drawable/bg_shutter_orange_circle"
android:layout_marginBottom="24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="@id/layoutZoomGroup"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:contentDescription="Shutter Button" />
</androidx.constraintlayout.widget.ConstraintLayout>
<!-- KHU VỰC ĐIỀU KHIỂN CHỈNH SỬA ẢNH (Thay thế Control Panel khi nhấn giữ preset) -->
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/layoutTimelineEditor"
android:layout_width="match_parent"
android:layout_height="180dp"
android:background="#000000"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent">
<!-- TẦNG 1: THANH TRƯỢT THƯỚC ĐO ĐỘC ĐÁO (RULER SLIDER) -->
<FrameLayout
android:id="@+id/rulerContainer"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="8dp"
app:layout_constraintTop_toTopOf="parent">
<com.photobooth.app.RulerView
android:id="@+id/rulerView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<!-- Kim chỉ số 0 màu cam chính giữa cố định -->
<LinearLayout
android:id="@+id/layoutRulerPointer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center">
<TextView
android:id="@+id/tvRulerValue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:textColor="#FF9800"
android:textSize="12sp"
android:textStyle="bold"
android:layout_gravity="center_horizontal"/>
<ImageView
android:layout_width="12dp"
android:layout_height="12dp"
android:src="@drawable/ic_arrow_down_orange"
android:layout_gravity="center_horizontal"
android:contentDescription="Indicator" />
</LinearLayout>
</FrameLayout>
<!-- TẦNG 2: PHẦN HIỂN THỊ ICON CÁC THUỘC TÍNH (HORIZONTAL LIST) -->
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rvAttributeIcons"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:paddingStart="16dp"
android:paddingEnd="16dp"
android:clipToPadding="false"
app:layout_constraintTop_toBottomOf="@id/rulerContainer"
app:layout_constraintBottom_toTopOf="@id/layoutEditorActionButtons" />
<!-- TẦNG 3: THANH THAO TÁC HOÀN THÀNH (HỦY / ĐỒNG Ý) -->
<RelativeLayout
android:id="@+id/layoutEditorActionButtons"
android:layout_width="match_parent"
android:layout_height="48dp"
android:paddingStart="20dp"
android:paddingEnd="20dp"
app:layout_constraintBottom_toBottomOf="parent">
<!-- Nút X (Hủy bỏ các thông số vừa chỉnh) -->
<ImageButton
android:id="@+id/btnEditorClose"
android:layout_width="36dp"
android:layout_height="36dp"
android:background="@null"
android:src="@drawable/ic_close_white"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:contentDescription="Close" />
<!-- Nút Dấu Tích (Đồng ý để lưu preset) -->
<ImageButton
android:id="@+id/btnEditorCheck"
android:layout_width="36dp"
android:layout_height="36dp"
android:background="@null"
android:src="@drawable/ic_check_white"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:contentDescription="Save" />
</RelativeLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<!-- Biểu tượng loading xoay tròn khi đang xử lý ảnh -->
<ProgressBar
android:id="@+id/progressBar"
android:layout_width="64dp"
android:layout_height="64dp"
android:visibility="gone"
android:elevation="10dp"
android:indeterminateTint="@color/theme_primary"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>