android Style 小结

本文介绍了Android中的样式(Style)和主题(Theme)的概念及其使用方法。详细解释了如何定义样式和主题,包括基本属性设置、样式引用及继承关系。通过实例展示了如何在布局文件中应用这些样式。

 Android上的Style分为了两个方面:

              1. Theme是针对窗体级别的,改变窗体样式;
              2. Style是针对窗体元素级别的,改变指定控件或者Layout的样式。


              Android系统的themes.xml和style.xml(位于\base\core\res\res\values\)包含了很多系统定义好的style,建议在里面挑个合适的,然后再继承修改。

       以下属性是在Themes中比较常见的,源自Android系统本身的themes.xml:
        <!-- Window attributes -->
        <item name="windowBackground">@android:drawable/screen_background_dark</item>
        <item name="windowFrame">@null</item>
        <item name="windowNoTitle">false</item>
        <item name="windowFullscreen">false</item>
        <item name="windowIsFloating">false</item>
        <item name="windowContentOverlay">@android:drawable/title_bar_shadow</item>
        <item name="windowTitleStyle">@android:style/WindowTitle</item>
        <item name="windowTitleSize">25dip</item>
        <item name="windowTitleBackgroundStyle">@android:style/WindowTitleBackground</item>
        <item name="android:windowAnimationStyle">@android:style/Animation.Activity</item>
各种样式具体使用可看: http://henzil.easymorse.com/?p=364
《android Theme使用总结 》。我就不在这里黄婆卖瓜了



     至于  android的style就比较的广泛了,如果有过web css开发经典的人来说,应该看一下就会懂的,当然也有它不同之处了。

     android的style文件我们是放在res/values目录下面的,当然它是一个 xml文件 ,根节点是:resources. 下面是一个示例:
          <?xml version="1.0" encoding="utf-8"?>
          <resources>
              <style name="TextStyle">
                 <item name="android:textSize">14sp</item>
                 <item name="android:textColor">#fff</item>
                 </style>
         </resources>

     在 style里面只需要定义需要改变的属性,不作设定的程序会自动引用系统默认的属性。
    在布局文件中我们怎么引用呢?
            <EditText id="@+id/editText1"
                style="@style/TextStyle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Hello, World!" />

      其它经过引用style后的EditText定义为:

             <EditText id="@+id/editText1"
                android:layout_textSize="14sp"
                android:textColor="#fff"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Hello, World!" />
这样就更好的理解了吧?到于style item中的name应该怎么写?我想你也能知道了吧?

以上只是style的一些简单的应用 ,下在将会讲到一个非常实用的知识,也就是style的继承关系。这样才能更好的简化我们代码的工作量,也更利用整个程序逻辑的组建。它的继承关系可以有两种实现的方式:
                1. 是通过 parent属性来指定 ,

                2. 通过点号来指定

       接下来我们分别来举例:
                我们程序中应用到最多的可能就是TextView了,它可能会有很多种情况 ,比如 作为title,正文,提示等等,而这一些的TextView有他的共同点,也有他们的不同之处。首先我们定义一个通过的style:

                <style name="TextStyle">
                  <item name="android:shadowDx">-0.5</item>
                  <item name="android:shadowDy">1</item>
                  <item name="android:shadowRadius">0.5</item>
                  <item name="android:singleLine">true</item>
                  <item name="android:ellipsize">marquee</item>
                </style>
                以上主要是定义了他的阴影啊,单行啊,超过长度怎么办啊。
                接下来我们再定义一个title级别的样式,title我们也想要这些属性,那么就得继承它了。
                首先我们用 parent属性来继承

                <style name="TextTitle" parent="TextStyle">
                     <item name="android:textSize">18sp</item>
                     <item name="android:textColor">#fff</item>
                    <item name="android:textStyle">bold</item>
                </style>

                parent属性中跟的就是父类的名称,就样title的阴影 ,字体大小 ,辨色,粗细就一起出来了,而我们不用再去定义title的阴影了。节省了不少的时间。
                第二种继承是利用parentStyle.childStyle的方式 ,用点号来继承 ,上面的TextTitle我们也可以这样写:

                   <style name="TextStyle.TextTitle">
                     <item name="android:textSize">18sp</item>
                     <item name="android:textColor">#fff</item>
                     <item name="android:textStyle">bold</item>
                </style>
                这样也能得到预期的效果。这样做不爽的地方 就是名字就长了,我们在引用这个style的时候,就得 style="@style/TextStyle.TextTitle",如果继承的层级越多,这个名字就会越长。

                怎么样?看懂了吧?这只是一些简单的应用 ,当然想制作出更漂亮的 style就得自己动手 去多练习一下,经验是不断的尝试积累出来的。
Android 中自定义实现一个“**同心结(Concentric Knot)**”,本质上是通过 **绘制一条类似 8 字形的路径(莫比乌斯环变形)**,并让视图或动画沿着这条路径运动。 --- ## ✅ 实现目标 - 使用 `Path` 绘制出一个“同心结”路径 - 自定义 View 显示该路径 - 支持后续动画、图像叠加等扩展功能 --- ## 🧱 技术原理 | 组件 | 作用 | |------|------| | `Path` | 构建“同心结”路径(使用贝塞尔曲线) | | `Canvas.drawPath()` | 将路径绘制到屏幕上 | | `onSizeChanged()` | 获取 View 宽高以确定路径中心和大小 | | `贝塞尔曲线` | 用于构建平滑的“8字”形状路径 | --- ## 📦 示例代码:自定义 View 实现同心结 ### 1. 创建 `ConcentricKnotView.java` ```java package com.example.lovedemo.view; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Path; import android.util.AttributeSet; import android.view.View; public class ConcentricKnotView extends View { private Paint pathPaint; private Path path; public ConcentricKnotView(Context context) { this(context, null); } public ConcentricKnotView(Context context, AttributeSet attrs) { super(context, attrs); init(); } private void init() { path = new Path(); pathPaint = new Paint(); pathPaint.setColor(Color.RED); pathPaint.setStyle(Paint.Style.STROKE); pathPaint.setStrokeWidth(6f); pathPaint.setAntiAlias(true); } @Override protected void onSizeChanged(int w, int h, int oldw, int oldh) { super.onSizeChanged(w, h, oldw, oldh); buildConcentricKnot(w / 2f, h / 2f, Math.min(w, h) / 3f); } private void buildConcentricKnot(float centerX, float centerY, float radius) { path.reset(); float ctrlRadius = radius * 1.5f; // 第一段贝塞尔曲线:上半部分 path.moveTo(centerX, centerY - radius); path.cubicTo( centerX + ctrlRadius, centerY - ctrlRadius, centerX + ctrlRadius, centerY + ctrlRadius, centerX, centerY + radius ); // 第二段贝塞尔曲线:下半部分,形成闭环 path.cubicTo( centerX - ctrlRadius, centerY + ctrlRadius, centerX - ctrlRadius, centerY - ctrlRadius, centerX, centerY - radius ); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); canvas.drawPath(path, pathPaint); // 绘制路径 } } ``` --- ### 2. 在 XML 布局中使用这个 View ```xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:gravity="center" android:background="#FFFFFF"> <com.example.lovedemo.view.ConcentricKnotView android:layout_width="300dp" android:layout_height="300dp" /> </LinearLayout> ``` --- ## 🎨 效果说明 - 屏幕中央显示一个红色的“同心结”图案 - 路径由两个贝塞尔曲线构成,形成一个闭合的“8字” - 可作为动画路径、图形背景、装饰元素等基础组件 --- ## 🔧 扩展建议 你可以在此基础上添加以下功能: | 功能 | 描述 | |------|------| | 添加星星沿路径移动 | 使用 `PathMeasure` 和 `ValueAnimator` 控制位置 | | 加入缩放/透明度动画 | 每个点可以是一个 `ImageView`,配合动画器 | | 改变路径颜色和粗细 | 支持 XML 自定义属性配置 | | 手势交互 | 点击、拖动控制路径旋转或缩放 | | 替换为其他形状 | 如心形、爱心结、螺旋等 | --- ## ✅ 总结 你现在可以在 Android 中自定义实现一个“同心结”。核心在于: | 技术点 | 关键实现 | |--------|-----------| | 贝塞尔曲线 | 使用 `cubicTo()` 构建“8字”路径 | | 路径绘制 | `Canvas.drawPath()` 渲染图形 | | 自定义 View | 继承 `View` 类,重写 `onDraw()` 和 `onSizeChanged()` | | 可扩展性 | 可作为动画路径、图形展示的基础组件 | --- ###
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值