img { display: block; max-width:230px; max-height:95px; width: auto; height: auto; } <p>This image is originally 400×400 pixels, but should get resized by the CSS:</p> <img width=”400″ height=”400″ src=”https://i.stack.imgur.com/aEEkn.png”> This will make image shrink if it’s too big for specified area (as downside, it will not enlarge image).
Create a pixmap: pixmap = QtGui.QPixmap(path) and then use QPixmap.scaledToWidth or QPixmap.scaledToHeight: pixmap2 = pixmap.scaledToWidth(64) pixmap3 = pixmap.scaledToHeight(64) With a 2048×1024 image, the first method would result in an image that is 64×32, whilst the second would be 128×64. Obviously it is impossible to resize a 2048×1024 image to 64×64 whilst keeping the same aspect … Read more
The property you’re looking for is object-fit. This is one of Opera’s innovations, you can read more about it in their 2011 dev article on object-fit (yep, it’s been around that long). A few years ago, I wouldn’t have been able to recommend it to you, but caniuse shows that everyone else is starting to … Read more
Imagemagick 7.0.7.22 and above -crop 3:2 works since January 6th, 2018. JPG magick convert in.jpg -gravity center -crop 3:2 out.jpg Warning/reminder: if you don’t use -gravity center, you will get two output files: PNG As fmw42 points out, PNG files store the virtual canvas size. +repage is recommended. magick convert in.png -gravity center -crop 3:2 … Read more
You don’t have to implement your own layout manager. You can do with inheriting QWidget and reimplementing int QWidget::heightForWidth( int w ) { return w; } to stay square. However, heightForWidth() doesn’t work on toplevel windows on X11, since apparently the X11 protocol doesn’t support that. As for centering, you can pass Qt::AlignCenter as the … Read more
You can use an image that has the desired proportions as to help with proportional sizing (images can be scaled proportionally by setting one dimension to some value and other to auto). The image does not have to be visible, but it must occupy space. .box { position: absolute; bottom: 0; left: 0; height: 50%; … Read more
<LinearLayout android:layout_width=”fill_parent” android:layout_height=”wrap_content” android:id=”@+id/layoutButtons”> <com.package.SquareButton android:layout_height=”fill_parent” android:layout_width=”0dip” android:layout_weight=”1″ <ImageView android:id=”@+id/box1″ android:layout_gravity=”center” android:adjustViewBounds=”true” android:scaleType=”centerInside” android:layout_height=”wrap_content” android:layout_width=”0dp” android:layout_weight=”1″ android:layout_marginLeft=”5dp” android:layout_marginRight=”5dp”/> </com.package.SquareButton> <com.package.SquareButton android:layout_height=”fill_parent” android:layout_width=”0dip” android:layout_weight=”1″ <ImageView android:id=”@+id/box2″ android:layout_gravity=”center” android:adjustViewBounds=”true” android:scaleType=”centerInside” android:layout_height=”fill_parent” android:layout_width=”fill_parent” android:layout_marginLeft=”5dp” android:layout_marginRight=”5dp”/> </com.package.SquareButton> ……… </LinearLayout> And then add this custom button class: public class SquareButton extends LinearLayout { public SquareButton(Context context) { super(context); } public … Read more
You should extends from the built-in video view. Call setVideoSize before video view is shown, you can get video size from thumbnail extracted from video. So that, when video view’s onMeasure is called, both mVideoWidth & mVideoHeight are > 0. If you want to account the height of controllers, you can do it yourself in … Read more
New answer : To make the table cells square, you can use the aspect-ratio property on a div inside the td element. Like this : table { width: 90%; } td { width: 33.33%; position: relative; } td .content { aspect-ratio: 1 / 1 ; background: gold; } <table> <tr> <td><div class=”content”>1</div></td> <td><div class=”content”>1</div></td> <td><div … Read more
There are 3 main techniques to keep the aspect ratio of a responsive element. The first one is by far the best and will work for a variety of use cases : the aspect-ratio CSS property. The 2 others may suit other use cases : using padding or vw units : (for a complete solution … Read more