-
等级
本版专家分：74结帖率 96.72% -
我用手机作为视频源采集，通过网络发送给PC，PC端用网页显示手机拍摄的视频，我想尽量全屏显示视频，当手机横屏拍摄时，全屏显示正常；当手机竖屏拍摄时，只能显示部分图像，所以我想高度全屏，横向根据图像比例等比设置宽度，不知道CSS怎么设置，求大侠指点。
展开阅读全文
-
等级
本版专家分：263 -
height: 100vh;
-
等级
本版专家分：1849勋章
-
- 签到新秀 累计签到获取，不积跬步，无以至千里，继续坚持！
-
- 黄花 2013年9月 扩充话题大版内专家分月排行榜第二
-
-
css 除了 PX 像素以外 还要 vh 这个屏幕宽度这个东西 楼主可以搜搜看 楼上也是正解
-
等级
本版专家分：74
-
谢谢回复。这个属性我已经配置过了，高度和Viewport的高度一致，width我不设置，想让宽度随视频分辨率等比变化，初始时是正常的，当我手机的横竖屏切换几次后，宽度越来越窄。具体设置如下：
[data-component='Peers'] {
min-height: 100%;
width: 100%;
+desktop() {
height: 100vh;
width: 100%;
display: flex;
flex-direction: column;//row
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
+mobile() {
min-height: 100vh;
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
> .peer-container {
overflow: hidden;
AppearFadeIn(100000ms);
+desktop() {
flex: 0 0 auto;//0 0 auto
height: 100vh;
initial-scale: 1;
margin: 6px;
border: 1px solid rgba(#fff, 0.15);
box-shadow: 0px 5px 12px 2px rgba(#111, 0.5);
transition-property: border-color;
transition-duration: 0.35s;
&.active-speaker {
border-color: #fff;
}
}
+mobile() {
flex: 100 100 auto;
order: 2;
min-height: 25vh;
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
&.active-speaker {
order: 1;
}
}
}
}
- Android使用SurfaceView播放视频时横竖屏的调整
这样在播放横屏录制的视频时没有问题，但是一旦播放竖屏录制的视频问题就大了，图像都是偏转90度的。这可怎么办呢？我的解决思路： 1.将SurfaceView偏转90度，结果黑呼呼一片啥都不显示。 2.将包含...
- 节操播放器问题的较完整总结（上）
在实际的开发中，用到了节操播放器，遇到了不少问题，于是就抽时间对所遇到的问题做了一个总结。以便于以后的查看，也希望可以对他人有一点帮助。
- 自定义Android视频播放器 - 切换横竖屏
前一篇自定义了SurfaceView，然后尝试横屏显示，虽然视频适配方面没有问题，但是没有占满整个屏幕。 我分析了一下一般的视频播放器，发现： 竖屏播放视频，播放器的宽度占满手机屏幕的宽度，播放器的高度根据视频...
- Android开发之使用VideoView实现视频的横屏播放、去除边框
做项目需要播放一个引导视频，本以为很简单，结果动手时发现总有瑕疵，幸好有度娘，现把收获总结如下： 一、实现视频播放： 注明我这里要播放的是Android项目中的资源文件，而不是访问SD卡播放视频。 1.先把要...
- Android-->播放视频横竖屏切换的2种方式
Activity的横竖屏切换其实很简单, 如果你的Activity没有声明android:configChanges, 那么Activity的方向就会随着手机的旋转而旋转. (手机需要开启自动旋转功能, 通常在手机的顶部通知栏中)本来这样就搞定了, 但是…....
- android surfaceview自定义视频播放器横竖屏切换总结
这两天在做一个视频播放器，然后需要实现点击按钮全屏与半屏视图的切换，实际操作时却发现问题很多，当切换全屏时，就要将屏幕先从横屏转为竖屏显示，在代码中若执行 setRequestedOrientation(ActivityInfo.SCREEN_...
- 解决Android视频播放横竖屏切换播放问题！
在以前的版本中只要在AndroidManifest.xml文件中对activity指定android:configChanges="keyboardHidden|orientation"属性，转屏的时候就会不再重新调用OnCreate()函数，而是调用onConfigurationChanged()。...
- Android 播放视频时横竖屏的调整
这样在播放横屏录制的视频时没有问题，但是一旦播放竖屏录制的视频问题就大了，图像都是偏转90度的。这可怎么办呢？我的解决思路： 1.将SurfaceView偏转90度，结果黑呼呼一片啥都不显示。 2.将包含...
- Android模拟器横屏和竖屏的切换
横屏：Ctrl+F11 竖屏：Ctrl+F12
- Android开发之锁屏显示Activity
最近在做视频通话是基于环信服务的，和微信视频通话是一样的，只不过是Activity横竖屏问题。结果就出问题了，竖屏在各个手机上没问题，可是横屏在华为7.0系统上就闪退了。 只能做到，电话来了，屏幕点亮，解开屏锁，...
- Android中WebView播放网上视频，横竖屏切换
效果图： 源码下载
- Android 界面横竖屏切换 顶部状态栏（标题栏）显示与隐藏
就不墨迹了，直接上图看效果： 图一： 图二： 可以很看到图一有状态栏
- android 横竖屏切换属性和播放视频全屏切换
最近在做平板项目，需要用到横屏切换，现在把属性贴出来方便以后查看。通常我们的应用只会设计成横屏或者竖屏，锁定横屏或竖屏的方法是在manifest.xml文件中设定属性android:screenOrientation为”landscape”或”...
- h5 video标签 全屏后 视频只显示一半
android webview调用H5页面播放视频(使用的是H5的video标签) 部分手机(小米NOTE 三星glaxyA7、ZUK等)全屏后视频只显示了一半 有没有什么解决方案？![图片说明]...
- 菜鸟学android——webview播放网络视频，由竖屏转换为横屏全屏播放
近来做一个应用，遇到了这样的问题，介绍一下场景吧： 从论坛上抓取
- 关于iOS只在视频全屏播放下允许横屏的解决方法
今天在利用MPMoviePlayController写一个小Demo时发现了一点点小的问题，因为整个项目都是只支持竖屏浏览，所以就导致了在播放视频的时候全屏进入时旋转屏幕视频却不能横屏显示，无疑，在视频体验这方面这种体验是极...
- 微信浏览器横屏显示问题
移动端html开发，我们常会用到横竖屏的判断做一些事情，比如说播放视频的时候时常使用横竖屏切来切换居中显示和全屏显示，如果你无数次尝试都失败了，请你看到最后，有惊喜哦！！。 一般来说，横竖屏的检测方式有...
- Android中关于全屏显示和返回原始状态（视频等方面在横竖屏切换用到）
在改变全屏与否状态栏的显示或隐藏时，关于屏幕参数的设置，竖屏切换到横屏时需要提前设置状态栏隐藏；而横屏切换到竖屏时需要现用现设，以上设置规则为必要条件。2.横竖屏切换时，我们最好不要让Activity重新创建...
- android自定义view，时间刻度尺，时间轴，视频轴
TimeRuler 最新版见github地址(欢迎star)：https://github.com/huangdali/TimeRuler 时间轴、时间刻度尺 继承至TextureView，效率更高 ...显示有效视频时间 超时（超过00:00:00,、23:59:59）自动处理 带拖动开
- IMSDroid问题集
1、IMSDroid切换摄像头后的接收方横屏显示，其实很多种情况下都会突然发现就横屏了，解决办法就是切换摄像头时同时切换横竖屏显示 2、IMSDroid掉音问题：IMSDroid通话几分钟后会发现声音没了，完全听不到任何声音，...
- iOS屏幕旋转之为横屏视频播放增加竖屏模式
在App Store上的大部分视频播放App中，都实现了竖屏小屏播放以显示更多相关信息，横屏切换到全屏播放，这样的交互显得优雅而大方。最近项目里有个这样的需求，为全屏视频播放加上竖屏模式。下面，让我们一起来实现这...
- Android视频播放器横竖屏自动切换
1、功能类 package ... import android.app.Activity; import android.content.Context; import android.content.pm.ActivityInfo;...import android.hardware.Sensor;...import android.hardware.Sensor
- Android 视频播放横屏布局错乱问题
最近在开发项目中使用ijkplayer框架进行视频播放，遇到了一个非常头疼的问题 横屏的时候布局错乱，如下图所示 ViewPager中加载ijkplayer，ViewPager固定高度的时候横屏的时候会出现这种结果 处理方式/** * 屏幕...
- surfaceview叠加问题（地图上显示视频）
终于忙里抽闲可以总结一下最近忙的晕头转向的东西了 公司的app是以地图为主（即主界面是地图 其他界面都是覆盖上层的fragment），...地图上覆盖fragment里面包含视频播放器时 视频播放器会是透明的无法显示。后来在
- Android 使用MediaCodec实现视频的无缝切换
百度上面很多视频播放都是利用MediaPlayer+显示视图（SurfaceView、TextureView）进行本地或者网络视频的播放。那么利用MediaCodec对视频流进行硬解码的小伙伴该如何在不同的控件之间无缝切换呢？是不是TextureView...
- Android视频播放和横竖屏切换
最近做了一个项目，里面用到了视频播放这一块，当时想考虑Vitamio，demo也做了出来，但是后来发现它是商业收费的，并且收费相当可观，所以只能放弃了。然后找到了ijkPlayer，功能也很强大，最终选择了Wei_Leng基于...
- Android VideoView播放视频竖屏切换横屏有黑白边无法全屏
问题描述:Android VideoView播放视频竖屏切换横屏有黑边无法全屏 解决办法是自定义VedioView,动态设置宽高。 * 1.自定义VedioView,并在onMeasure中添加int width = getDefaultSize(0,widthMeasureSpec); int height...
- Android 设置禁止横屏失效解决方法
最近在处理app的界面的时候，由于当手机进行横屏旋转时，显示的效果很差，故需要将横屏的旋转关闭。到网上查了很多的方法，网上的处理办法主要为：在androidMainfest.xml中对activity进行横屏限制。 具体操作方法为...
- Android 横竖屏切换加载不同的布局
1.禁止APP内横竖屏切换 在 配 置 Activity 的 地 方 进 行 如 下 的 配 置 android:screenOrientation="portrait"（landscape 是横向，portrait 是纵向）。这样就可以保证是竖屏总是竖屏 android...
- Android 视频播放适配横竖屏切换功能的实现
项目中视频的播放之前的设计一直是根据视频的宽高进行判断，以最大程度显示界面的方式来播放视频。目前打算适配横竖屏的切换，现在的设计是：若屏幕为竖屏锁定，播放视频就竖屏锁定；若屏幕为横屏锁定， 播放视频就...