英文:
Set a title and description for each photo in carouse android
问题
<string name="first_image_title">第一张图片标题</string>
<string name="first_image_desc">这是第一张图片的描述</string>
<string name="second_image_title">第二张图片标题</string>
<string name="second_image_desc">这是第二张图片的描述</string>
<string name="third_image_title">第三张图片标题</string>
<string name="third_image_desc">这是第三张图片的描述</string>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="fragments.SafetyFragment">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/tabContent"
android:background="@drawable/rounded_corner2">
<com.synnapps.carouselview.CarouselView
android:id="@+id/carouselView"
android:layout_width="match_parent"
android:layout_height="200dp"
app:fillColor="#FFFFFFFF"
app:pageColor="#00000000"
app:radius="6dp"
app:slideInterval="5000"
app:strokeColor="#FF777777"
app:strokeWidth="1dp"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/textTitle"
android:layout_below="@+id/carouselView"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/textDesc"
android:layout_below="@+id/textTitle"/>
</RelativeLayout>
</RelativeLayout>
public class SafetyFragment extends Fragment {
private CarouselView carouselView;
private int[] sampleImages = {R.drawable.image1,
R.drawable.image2, R.drawable.image3,
R.drawable.image4, R.drawable.image5,
R.drawable.image6};
public SafetyFragment() {
// Required empty public constructor
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View root = inflater.inflate(R.layout.fragment_safety, container, false);
carouselView = root.findViewById(R.id.carouselView);
ImageListener imagesListenerx = new ImageListener() {
@Override
public void setImageForPosition(int position, ImageView imageView) {
Glide.with(SafetyFragment.this).load(sampleImages[position]).into(imageView);
}
};
ViewListener viewListener = new ViewListener() {
@Override
public View setViewForPosition(int position) {
View customView = getLayoutInflater().inflate(R.layout.custom_image_layout, null);
TextView titleTextView = customView.findViewById(R.id.textTitle);
TextView descTextView = customView.findViewById(R.id.textDesc);
switch (position) {
case 0:
titleTextView.setText(getString(R.string.first_image_title));
descTextView.setText(getString(R.string.first_image_desc));
break;
case 1:
titleTextView.setText(getString(R.string.second_image_title));
descTextView.setText(getString(R.string.second_image_desc));
break;
case 2:
titleTextView.setText(getString(R.string.third_image_title));
descTextView.setText(getString(R.string.third_image_desc));
break;
// Handle other positions similarly
}
return customView;
}
};
carouselView.setPageCount(sampleImages.length);
carouselView.setViewListener(viewListener);
return root;
}
}
英文:
I am using a carouselView library for my app. https://github.com/sayyam/carouselview
The images are displaying and the carousel is working but how do I set a title and description below each image as it slides for each image.
I have a string containing all the title and text for each image.
e.g
<string name="first_image_title">First image title</string>
<string name="first_image_desc">This is a description for first image title</string>
<string name="second_image_title">2nd image title</string>
<string name="second_image_desc">This is a description for the second image title</string>
<string name="third_image_title">3rd image title</string>
<string name="third_image_desc">This is a description for the third image title</string>
All these are supposed to be placed below the sliding images (for each image.)
fragment_safety.xml
Containing the image and where the title and description for each image supposed to be
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="fragments.SafetyFragment">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/tabContent"
android:background="@drawable/rounded_corner2">
<com.synnapps.carouselview.CarouselView
android:id="@+id/carouselView"
android:layout_width="match_parent"
android:layout_height="200dp"
app:fillColor="#FFFFFFFF"
app:pageColor="#00000000"
app:radius="6dp"
app:slideInterval="5000"
app:strokeColor="#FF777777"
app:strokeWidth="1dp"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/textTitle"
android:layout_below="@+id/carouselView"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/textDesc"
android:layout_below="@+id/textTitle"/>
</RelativLayout>
SafetyFragment.java
According to the doc, I am supposed to implement ViewListener for customView but I cant wrap my head around how to do this....Get all the titles and description in the string and set them for each of the images sliding.
public class SafetyFragment extends Fragment {
private CarouselView carouselView;
private int[] sampleImages = {R.drawable.image1,
R.drawable.image2, R.drawable.image3,
R.drawable.image4, R.drawable.image5,
R.drawable.image6};
public SafetyFragment() {
// Required empty public constructor
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
View root = inflater.inflate(R.layout.fragment_safety, container, false);
carouselView = root.findViewById(R.id.carouselView);
ImageListener imagesListenerx = new ImageListener() {
@Override
public void setImageForPosition(int position, ImageView imageView) {
Glide.with(SafetyFragment.this).load(sampleImages[position]).into(imageView);
}
};
ViewListener viewListener = new ViewListener() {
@Override
public View setViewForPosition(int position) {
View customView = getLayoutInflater().inflate(R.layout.fragment_safety, null);
//set view attributes here
return customView;
}
};
carouselView.setPageCount(sampleImages.length);
carouselView.setViewListener(viewListener);
return root;
}
}
答案1
得分: 1
好的，以下是翻译好的内容：
-
为每个要在轮播中显示的文本声明一个字符串数组
private String[] titles = {"One", "Two", "Three"}; -
设置自定义视图监听器并在布局中获取视图
ViewListener viewListener = new ViewListener() { int i; @Override public View setViewForPosition(int position) { View customView = getLayoutInflater().inflate(R.layout.fragment_safety, null); // 在此处设置视图属性 safety_title = customView.findViewById(R.id.safetyTextTitle); safety_images = customView.findViewById(R.id.safetyImages); Glide.with(SafetyFragment.this).load(sampleImages[position]).into(safety_images); // 非常重要 safety_title.setText(titles[position]); return customView; } };
英文:
I found a way to do this.
1.Declare a string array for each text you want to display in each carousel
private String[] titles = {"One", "Two", "Three"}
2. Set a custom view listener and get the view in the layout
ViewListener viewListener = new ViewListener() {
int i;
@Override
public View setViewForPosition(int position) {
View customView = getLayoutInflater().inflate(R.layout.fragment_safety, null);
//set view attributes here
safety_title = customView.findViewById(R.id.safetyTextTitle);
safety_images = customView.findViewById(R.id.safetyImages);
Glide.with(SafetyFragment.this).load(sampleImages[position]).into(safety_images);
//Very Important
safety_title.setText(titles[position]);
return customView;
}
};
答案2
得分: 0
根据文档，您可以创建一个自定义视图并将视图与数据绑定。
ViewListener viewListener = new ViewListener() {
@Override
public View setViewForPosition(int position) {
View customView = getLayoutInflater().inflate(R.layout.view_custom, null);
// 在这里设置视图属性
return customView;
}
};
英文:
As per the documentation you can create a custom view and bind views with the data
ViewListener viewListener = new ViewListener() {
@Override
public View setViewForPosition(int position) {
View customView = getLayoutInflater().inflate(R.layout.view_custom, null);
//set view attributes here
return customView;
}
};
答案3
得分: 0
以下是您提供的内容的翻译：
我使用了这种方式：
ViewListener viewListener = new ViewListener() {
@Override
public View setViewForPosition(int position) {
View customView = getLayoutInflater().inflate(R.layout.custom_carousel, null);
// 在这里设置视图属性
TextView car_title = (TextView) customView.findViewById(R.id.textTitle);
ImageView car_image = (ImageView) customView.findViewById(R.id.imageView);
car_title.setText(sampleTitle[position]);
car_image.setImageResource(sampleImages[position]);
return customView;
}
};
而 custom_carousel.xml 中的自定义视图将如下所示：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<ImageView
android:id="@+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/textDesc"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
tools:src="@tools:sample/avatars[1]" />
<TextView
android:id="@+id/textTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:text="测试" />
</RelativeLayout>
英文:
I use this way:
ViewListener viewListener = new ViewListener() {
@Override
public View setViewForPosition(int position) {
View customView = getLayoutInflater().inflate(R.layout.custom_carousel, null);
//set view attributes here
TextView car_title = (TextView) customView.findViewById(R.id.textTitle);
ImageView car_image = (ImageView) customView.findViewById(R.id.imageView);
car_title.setText(sampleTitle[position]);
car_image.setImageResource(sampleImages[position]);
return customView;
}
};
While custom view in custom_carousel.xml will be like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<ImageView
android:id="@+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/textDesc"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
tools:src="@tools:sample/avatars[1]" />
<TextView
android:id="@+id/textTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:text="test" />
</RelativeLayout>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论