Android x Kotlin 實作課程:打造個人專屬計算機 APP EP4 更改背景屬性改變顯示外觀

更新於 發佈於 閱讀時間約 4 分鐘

打造個人專屬計算機 APP 系列文章目錄:
https://vocus.cc/article/65acea9ffd897800019c13dc

課程摘要

本課程學習如何修改按鈕外觀的方法,透過調整背景屬性和形狀。我們新增了四種背景顏色,修改每個按鈕的外觀。完成後,呈現不同按鈕風格。

教學影片

若您無法順利觀看教學影片,請先登入您的 YouTube 帳號,然後點擊以下連結加入我們的頻道會員:

  • 一般會員:成為一般會員後,您將能夠觀看我們所提供的一般會員專屬線上課程。
  • 精實會員:成為精實會員後,您將能夠觀看我們所提供的精實會員專屬線上課程。

範例程式碼

lightgray_button_background

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="800dp" />
<solid android:color="#A9A5A9" />
</shape>

darkgray_button_background

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#363236" />
</shape>

orange_button_background

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="800dp" />
<solid android:color="#ff8e00" />
</shape>

zero_button_background

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="800dp" />
<solid android:color="#363236" />
</shape>


avatar-img
12會員
245內容數
哈囉!歡迎光臨我的沙龍!我是 KT,一位對應用程式開發充滿熱情的開發者。在這個專屬空間,我將與您分享我在應用開發領域的深入學習心得和豐富的實戰經驗。如果您對應用程式開發技術同樣充滿好奇,渴望不斷探索新知,歡迎成為我們的會員,一起在應用程式開發的旅途上,探索更深層次的技術世界,享受學習的樂趣。
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
HKT實驗室 的其他內容
本課程學習如何提取共同屬性,透過 Style 樣式包,套用至每個按鈕。來提升佈局的可讀性和好維護性。
本課程學習如何如何實作計算機介面,佈局文字元件及按鈕。學習使用 LinearLayout 垂直排列元件,調整背景色。透過 GridLayout 佈局計算機按鈕。
我們將深入介紹如何使用 Kotlin 在 Android 平台上開發一個簡單的計算機應用程式。這個課程的目標是教授大家如何通過點擊計算機鍵盤,輸入算式,並得到計算結果。透過這套課程,你將能夠熟練掌握 Kotlin 語言在 Android 開發中的實際應用,並輕鬆打造出屬於自己的計算機應用程式。
本課程學習如何提取共同屬性,透過 Style 樣式包,套用至每個按鈕。來提升佈局的可讀性和好維護性。
本課程學習如何如何實作計算機介面,佈局文字元件及按鈕。學習使用 LinearLayout 垂直排列元件,調整背景色。透過 GridLayout 佈局計算機按鈕。
我們將深入介紹如何使用 Kotlin 在 Android 平台上開發一個簡單的計算機應用程式。這個課程的目標是教授大家如何通過點擊計算機鍵盤,輸入算式,並得到計算結果。透過這套課程,你將能夠熟練掌握 Kotlin 語言在 Android 開發中的實際應用,並輕鬆打造出屬於自己的計算機應用程式。
你可能也想看
Google News 追蹤
Thumbnail
隨著理財資訊的普及,越來越多台灣人不再將資產侷限於台股,而是將視野拓展到國際市場。特別是美國市場,其豐富的理財選擇,讓不少人開始思考將資金配置於海外市場的可能性。 然而,要參與美國市場並不只是盲目跟隨標的這麼簡單,而是需要策略和方式,尤其對新手而言,除了選股以外還會遇到語言、開戶流程、Ap
Thumbnail
嘿,大家新年快樂~ 新年大家都在做什麼呢? 跨年夜的我趕工製作某個外包設計案,在工作告一段落時趕上倒數。 然後和兩個小孩過了一個忙亂的元旦。在深夜時刻,看到朋友傳來的解籤網站,興致勃勃熬夜體驗了一下,覺得非常好玩,或許有人玩過了,但還是想寫上來分享紀錄一下~
Thumbnail
本章介紹了 CSS 中的顏色和背景屬性,包括文本顏色的設置方法、背景顏色和背景圖片的應用、背景重複和位置的配置,以及線性漸變和徑向漸變的使用。這些知識將幫助你更靈活地設計和美化網頁。
Thumbnail
這篇內容,將會講解什麼是函式,以及與函式相關的知識。包括函式的簡介、Runtime Function、自訂函式、Script Function 腳本函式、Method 方法。
這個系列的教學會列出基本上所有常見的造型和一些基礎 , 讓各位可以自行搭配造型~在這個第五篇呢 , 我們會來一起了解: 常見的按鈕樣式特性,怎麼使用他們,他們的作用是甚麼。讓我們一起了解如何自訂滑鼠以及使用常見的按鈕樣式特性,學會讓按鈕播放音效,切換滑鼠造型,以及避免圖片透明的地方被點擊到。
Thumbnail
iOS15推出了新的按鈕外觀設定功能,讓設定變得更加直觀。使用不同的圓角設定和圖片位置可以輕鬆創建不同風格的按鈕。另外,新的選取效果變化功能也讓按鈕設計更加靈活。本文將介紹這些新功能的使用方法和效果。
Thumbnail
Anytype主要分為四區塊:目錄欄(Widget組成)、主編輯畫面、導航選單、設定區。
Thumbnail
Creative Coding 作品變化概念,有或沒有的差別,隨機性,色彩模式的調整...等
Thumbnail
這次課程不僅帶來了新的理解,透過學習系統性的聯想隱喻,除了課本上的隱喻,也激盪出許多火花,在個案練習中,更是聽到許多隱喻調和帶來的深度與好處,期待未來更多的學習與成長!
前言 那麼今天要來教大家,如何實現各種排版,以及不同的 CSS 可以做出怎樣的效果。 整理好你的思緒,深深吸一口氣,讓我們在 2024 這嶄新的一年當中,開始新的學習之旅吧。 字體相關 color 設定文字的顏色。 <p style="color: blue;">這是藍色文字。</
前言 今天課程要來學習,在 .css 設計樣式後,怎麼透過選擇器,讓 .html 可以有所配對,經過這一步後,便可以開始學習,如何正式設計 .css 了。 選擇器 介紹 還記得上次課程,我們在 .css 檔案中,撰寫的程式碼嗎?讓我們來複習看看: .highlight { co
Thumbnail
今天紀錄的是因應工作需要而學習的小技能。 我想達到的目標:當欄位裡面出現「寄出」這個關鍵字的時候整欄變色,以辨別該項目的狀態。
Thumbnail
隨著理財資訊的普及,越來越多台灣人不再將資產侷限於台股,而是將視野拓展到國際市場。特別是美國市場,其豐富的理財選擇,讓不少人開始思考將資金配置於海外市場的可能性。 然而,要參與美國市場並不只是盲目跟隨標的這麼簡單,而是需要策略和方式,尤其對新手而言,除了選股以外還會遇到語言、開戶流程、Ap
Thumbnail
嘿,大家新年快樂~ 新年大家都在做什麼呢? 跨年夜的我趕工製作某個外包設計案,在工作告一段落時趕上倒數。 然後和兩個小孩過了一個忙亂的元旦。在深夜時刻,看到朋友傳來的解籤網站,興致勃勃熬夜體驗了一下,覺得非常好玩,或許有人玩過了,但還是想寫上來分享紀錄一下~
Thumbnail
本章介紹了 CSS 中的顏色和背景屬性,包括文本顏色的設置方法、背景顏色和背景圖片的應用、背景重複和位置的配置,以及線性漸變和徑向漸變的使用。這些知識將幫助你更靈活地設計和美化網頁。
Thumbnail
這篇內容,將會講解什麼是函式,以及與函式相關的知識。包括函式的簡介、Runtime Function、自訂函式、Script Function 腳本函式、Method 方法。
這個系列的教學會列出基本上所有常見的造型和一些基礎 , 讓各位可以自行搭配造型~在這個第五篇呢 , 我們會來一起了解: 常見的按鈕樣式特性,怎麼使用他們,他們的作用是甚麼。讓我們一起了解如何自訂滑鼠以及使用常見的按鈕樣式特性,學會讓按鈕播放音效,切換滑鼠造型,以及避免圖片透明的地方被點擊到。
Thumbnail
iOS15推出了新的按鈕外觀設定功能,讓設定變得更加直觀。使用不同的圓角設定和圖片位置可以輕鬆創建不同風格的按鈕。另外,新的選取效果變化功能也讓按鈕設計更加靈活。本文將介紹這些新功能的使用方法和效果。
Thumbnail
Anytype主要分為四區塊:目錄欄(Widget組成)、主編輯畫面、導航選單、設定區。
Thumbnail
Creative Coding 作品變化概念,有或沒有的差別,隨機性,色彩模式的調整...等
Thumbnail
這次課程不僅帶來了新的理解,透過學習系統性的聯想隱喻,除了課本上的隱喻,也激盪出許多火花,在個案練習中,更是聽到許多隱喻調和帶來的深度與好處,期待未來更多的學習與成長!
前言 那麼今天要來教大家,如何實現各種排版,以及不同的 CSS 可以做出怎樣的效果。 整理好你的思緒,深深吸一口氣,讓我們在 2024 這嶄新的一年當中,開始新的學習之旅吧。 字體相關 color 設定文字的顏色。 <p style="color: blue;">這是藍色文字。</
前言 今天課程要來學習,在 .css 設計樣式後,怎麼透過選擇器,讓 .html 可以有所配對,經過這一步後,便可以開始學習,如何正式設計 .css 了。 選擇器 介紹 還記得上次課程,我們在 .css 檔案中,撰寫的程式碼嗎?讓我們來複習看看: .highlight { co
Thumbnail
今天紀錄的是因應工作需要而學習的小技能。 我想達到的目標:當欄位裡面出現「寄出」這個關鍵字的時候整欄變色,以辨別該項目的狀態。