怎样在Android中制作一个从左到有三等分屏幕的布局

Posted 2023-04-28

一：不同的layout
android手机屏幕大小不一，有480x320, 640x360, 800x480.怎样才能让App自动适应不同的屏幕呢？
其实很简单，只需要在res目录下创建不同的layout文件夹，比如layout-640x360,layout-800x480,所有的layout文件在编译之后都会写入R.java里，而系统会根据屏幕的大小自己选择合适的layout进行使用。
二：hdpi、mdpi、ldpi
在之前的版本中，只有一个drawable，而2.1版本中有drawable-mdpi、drawable-ldpi、drawable-hdpi三个，这三个主要是为了支持多分辨率。
drawable- hdpi、drawable- mdpi、drawable-ldpi的区别：
(1)drawable-hdpi里面存放高分辨率的图片,如WVGA (480x800),FWVGA (480x854)
(2)drawable-mdpi里面存放中等分辨率的图片,如HVGA (320x480)
(3)drawable-ldpi里面存放低分辨率的图片,如QVGA (240x320)
系统会根据机器的分辨率来分别到这几个文件夹里面去找对应的图片。
更正：应该是对应不同density 的图片
在开发程序时为了兼容不同平台不同屏幕，建议各自文件夹根据需求均存放不同版本图片。
[i]备注：三者的解析度不一样，就像你把电脑的分辨率调低，图片会变大一样，反之分辨率高，图片缩小。 参考技术A 父布局使用LinearLayout，将orientation设置为horizontal

在子布局中使用android:layout_weight进行比例分配

如何从左到右创建动画或制作淡入淡出Angular 4

【中文标题】如何从左到右创建动画或制作淡入淡出Angular 4

【英文标题】：How to create an animation from left to right or making a fade Angular 4

【发布时间】：2018-12-27 11:26:03

【问题描述】：

我想在组件打开的时候做一个动画或者做一个淡入淡出。

这是代码

这是 HTML

<div *ngIf="showMePartially" class="container">
  <div class="body-container">
</div>
</div>

这是CSS

.container 
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    transition: opacity 0.5s ease-in;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.4);
    transition: 3s;

.body-container 
  width: calc(100% - 73em);
  position: relative;
  left: 70em;
  top: 7.5em;
  background: white;
  height: calc(100% - 18em);
  border-radius: 4px;
  padding-left: 11px; 
  transition: opacity 0.5s ease-in;
  animation-direction: normal;

【问题讨论】：

Angular (4, 5, 6) - Simple example of slide in out animation on ngIf的可能重复

***.com/questions/36417931/…

我会给出答案

没有解决我的问题

【参考方案1】：

可以使用css动画：

.body-container 
   /* above styles */
   animation: animation-name .3s ease-out forwards;


@keyframes animation-name 
  0% 
    opacity: 0;
  
  100% 
    opacity: 1;
  

您可以在关键帧内制作自己的动画。这应该可以工作，因为*ngIf 将从 dom 中删除元素，如果条件为 false，或者将其附加到 dom（这是动画应该工作的时候）。

编辑 对于从左到右的动画，您可以这样做：

@keyframes animation-name 
  0% 
    transform: translateX(100%);
  
  100% 
    transform: translateX(0%);
  

【讨论】：

这是你救了我的工人，但我怎么能从右到左动画呢？

只需将动画更改为：@keyframes animation-name 0% transform: translateX(100%); 100% 变换：translateX(0%);

我没听懂？

兄弟你知道我什么时候关闭拨号盘来创建动画