Android UI基礎 仿閒魚釋出頁
Android UI基礎 仿閒魚釋出頁
實現圖:
原始碼地址:
https://download.csdn.net/download/weixin_44758662/12819060
程式碼太長不好看
建議直接複製執行,需要可收藏
用到的資源在最下面
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colo_bac"
tools:context=".DemoActivity">
<RelativeLayout
android:id="@+id/relativeLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp"
android:text="取消"
android:textColor="@color/text_black"
android:textSize="16sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:padding="5dp"
android:text="釋出"
android:textColor="@color/text_main"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:background="@drawable/shape_yellow"
android:paddingStart="15dp"
android:paddingTop="5dp"
android:paddingEnd="15dp"
android:paddingBottom="5dp"
android:text="釋出"
android:textSize="14sp" />
</RelativeLayout>
<LinearLayout
android:id="@+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/shape_white"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/relativeLayout"
app:layout_constraintVertical_bias="0.0">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@null"
android:hint="標題"
android:padding="10dp"
android:textColor="@color/text_main"
android:textColorHint="@color/text_main1"
android:textSize="16sp" />
<EditText
android:layout_width="match_parent"
android:layout_height="120dp"
android:background="@null"
android:gravity="start|top"
android:hint="內容"
android:padding="10dp"
android:textColor="@color/text_main"
android:textColorHint="@color/text_main1"
android:textSize="16sp" />
</LinearLayout>
<LinearLayout
android:id="@+id/linearLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/shape_white"
android:orientation="vertical"
android:padding="10dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/linearLayout"
app:layout_constraintVertical_bias="0.0">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="@drawable/ic_add_black_48dp"
android:drawablePadding="5dp"
android:padding="10dp"
android:text="新增圖片" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="發貨地: 天津 津南區" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/shape_white"
android:orientation="vertical"
android:padding="10dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/linearLayout2"
app:layout_constraintVertical_bias="0.0">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="5dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="@drawable/icon_money" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:padding="5dp"
android:text="價格"
android:textColor="@color/text_main"
android:textSize="16sp" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawableEnd="@drawable/ic_right_24dp"
android:gravity="end|center_vertical"
android:padding="5dp"
android:text="¥0.00"
android:textColor="@color/colo_money"
android:textSize="16sp" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="2px"
android:background="@color/color_link" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="5dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="@drawable/icon_same" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:padding="5dp"
android:text="同款寶貝"
android:textColor="@color/text_main"
android:textSize="16sp" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawableEnd="@drawable/ic_right_24dp"
android:gravity="end|center_vertical"
android:padding="5dp"
android:text="關聯同款後,將推薦想買的人"
android:textColor="@color/text_main1"
android:textSize="16sp" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="2px"
android:background="@color/color_link" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="5dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="@drawable/icon_more" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawableEnd="@drawable/ic_right_24dp"
android:gravity="center_vertical"
android:layout_marginStart="5dp"
android:padding="5dp"
android:text="更多資訊"
android:textColor="@color/text_main"
android:textSize="16sp" />
</LinearLayout>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
使用到的資源:
color :
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="text_main">#49496a</color>
<color name="text_main1">#838895</color>
<color name="text_black">#4E5157</color>
<color name="colo_money">#ff4757</color>
<color name="colo_blue">#2196F3</color>
<color name="color_link">#f0f0f0</color>
<color name="colo_white">#fff</color>
<color name="colo_bac">#f8f8f8</color>
<color name="colo_yellow">#FEC62E</color>
<color name="colo_red">#E53935</color>
</resources>
使用到的圖片,我使用的是向量圖:
向量圖最大特點:使用者可以任意縮放影像顯示,而不會破壞影像的清晰度、細節等。
可以選擇Clip Art 也可以選擇網上下載的然後local file(圖片格式為SVG,PSD)本地匯入
使用: android:src="@drawable/icon_money" /> 即可
相關文章
- 微信小程式仿閒魚『下拉選單』微信小程式
- Flutter仿閒魚底部導航欄實現Flutter
- Android UI 繪圖基礎AndroidUI繪圖
- 如何製作基礎認證釣魚頁面?
- 閒魚:2023年閒魚日均GMV破10億 超1億人掛出閒置
- 一個高仿閒魚鍵自定義數字鍵盤特效特效
- python django整理(三)頁面基礎(仿BBS)PythonDjango
- android基礎學習-android篇day12-android的UI基礎入門AndroidUI
- android基礎學習-android篇day12-UI基礎控制元件(上)AndroidUI控制元件
- android基礎學習-android篇day13-UI基礎控制元件(下)AndroidUI控制元件
- UI基礎12UI
- UI仿寫UI
- Flutter高內聚元件怎麼做?閒魚閒魚打造開源高效方案!Flutter元件
- jQuery UI 1.9.0釋出jQueryUI
- Android簡單仿微博個人資訊頁Android
- Flutter學習筆記--仿閒魚底部導航欄帶有中間凸起圖示Flutter筆記
- 大魚號如何批量釋出視訊
- AlloyTouch 0.2.0釋出--魚和熊掌兼得
- 使用fjpublish釋出前端專案(基礎篇)前端
- Azure 基礎:用 PowerShell 自動釋出 CloudServicesCloud
- android基礎學習-android篇day14-UI基礎控制元件綜合案例——點餐系統AndroidUI控制元件
- 閒魚基於Flutter技術的架構演進和創新Flutter架構
- 閒魚基於Dart生態的FaaS前端一體化建設Dart前端
- 閒魚:2019年閒魚年會經濟資料 土豪公司年會送特斯拉
- 基於 React 的 UI 元件庫 uiw v1.2.10 釋出ReactUI元件
- vue 釋出網頁Vue網頁
- MIT釋出軟體機器魚,臥底魚群大計可成MIT
- Android基礎Android
- 閒話Java基礎和開發平臺Java
- ios 仿android的popupwindow彈出選單iOSAndroid
- Android仿微信支付密碼彈出層Android密碼
- nubia UI 2.8公測版正式釋出:基於安卓5.0系統UI安卓
- 閒魚APP關聯同款寶貝怎麼設定?閒魚關聯同款寶貝的設定方法APP
- Terraform 0.3 釋出,基礎架構管理工具ORM架構
- 零基礎學習UI設計容易出現哪些誤區UI
- Android基礎 淡入淡出、上下彈出動畫的Android動畫
- Java基礎-註釋Java
- 網頁佈局基礎網頁