Я пытаюсь сделать gridview с двумя столбцами. Я имею в виду две фотографии в строке рядом, как это изображение.
Но у моих картин есть промежутки между ними, потому что это не тот же самый размер. Вот что я получаю.
Как видно на первом рисунке, скрывается легенда, в которой указаны имя контакта и номер телефона. и другие картинки не растягиваются правильно.
Вот мой XML-файл GridView . Как вы можете видеть, columnWidth
установлено значение 200dp . Я бы хотел, чтобы это было автоматически , поэтому размер картинки будет изменяться автоматически для каждого размера экрана.
<?xml version="1.0" encoding="utf-8"?>
<GridView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/gridViewContacts"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="2"
android:columnWidth="200dp"
android:stretchMode="columnWidth"
android:gravity="center" />
и вот XML-файл item, который представляет каждый элемент.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="@+id/imageViewContactIcon"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY" />
<LinearLayout
android:id="@+id/linearlayoutContactName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingLeft="5dp"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:background="#99000000"
android:layout_alignBottom="@+id/imageViewContactIcon">
<TextView
android:id="@+id/textViewContactName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:textStyle="bold"
android:textSize="15sp"
android:text="Lorem Ipsum" />
<TextView
android:id="@+id/textViewContactNumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:layout_marginLeft="5dp"
android:focusable="true"
android:ellipsize="marquee"
android:marqueeRepeatLimit="marquee_forever"
android:textSize="10sp"
android:text="123456789" />
</LinearLayout>
</RelativeLayout>
Так что я хочу, чтобы показать два изображения в строке, и изображения автоматически меняются, независимо от размера экрана. Что я делаю не так на моем макете?
Спасибо.
scaleType
свойство centerCrop в ImageView. Чего мне нужно добиться, так это сделать изображения рядом друг с другом и автоматически изменять их размер для разных размеров экрана.Ответы:
Вот сравнительно простой способ сделать это. Добавьте GridView в макет, установив режим растягивания для растягивания ширины столбцов, установите интервал в 0 (или как хотите) и установите количество столбцов в 2:
разреш / макет / main.xml
Создайте кастом
ImageView
, поддерживающий соотношение сторон:SRC / COM / пример / graphicstest / SquareImageView.java
Создайте макет для элемента сетки с помощью этого SquareImageView и установите для scaleType значение centerCrop:
разреш / макет / grid_item.xml
Теперь сделайте своего рода адаптер для вашего
GridView
:SRC / COM / пример / graphicstest / MyAdapter.java
Установите этот адаптер на ваш
GridView
:И наслаждайтесь результатами:
источник
ImageView
и почему используйте что-то подобное этому<com.example.graphicstest.SquareImageView>
вместо простого<ImageView>
тега в файле XML . Не могли бы вы объяснить мне больше об этом соотношении сторон , и как не создание этого класса влияет на элементы. Есть ли способ оптимизировать это, без необходимости пользовательскогоImageView
класса? в любом случае спасибо за вашу помощь.Еще один простой подход с современными встроенными функциями, такими как PercentRelativeLayout , теперь доступен для новых пользователей, которые столкнулись с этой проблемой. спасибо команде Android за выпуск этого элемента.
и для лучшей производительности вы можете использовать некоторые вещи, такие как Picasso Image Loader, которые помогут вам заполнить всю ширину каждого изображения родителей. например, в вашем адаптере вы должны использовать это:
теперь вам больше не нужен класс CustomImageView.
PS Я рекомендую использовать ImageView вместо типа Int в классе Item.
надеюсь, это поможет ..
источник