現在、写真を投稿するアプリを開発しています。
そこで、投稿写真の閲覧回数に制限を設け、上限に達したら、写真にモザイクのようなカバーが表示される実装方法を教えていただきたいです。
私は、Visibility設定で
閲覧回数が上限でない場合は、写真を表示
閲覧回数が上限に達した場合は、モザイクのようなカバーを表示
のようにコンポーネントを重ねて表示すると、下記のような写真になってしまいます、、
どなたか改善策がありましたらご教授いただきたいです。
質問の意味が分からないので教えて下さい。画像が添付されていますが、どの部分が元の画像でどこが「モザイクのようなカバー」なのですか？元画像と被せる画像のサイズはどうなっているのですか？
そもそも投稿画像の写真は何枚あって、どういうサイズ・配置で、モザイク画像をどう被せたいのですか？
visibilityを使って元画像に別の画像をかぶせた時に何が問題になるのですか？
ご連絡ありがとうございます。
拙い質問となり、申し訳ございません。
機能全体の流れ：ユーザーが投稿写真を7回以上閲覧した場合、モザイクのような画像が投稿写真部分に表示され、閲覧できなくなる機能
＊元の投稿画像
質問の意味がようやく理解できました。Adaloのレスポンシブルの機能を考慮しないでやっているとそうなってしまいます。
（対策）
イメージスライダーとその上にかぶせる画像の幅を画面の横幅いっぱいに広げて下さい。（縦方向の寸法は同じでOKです）質問者さんの画像が広がってしまうのは余白を作っているからです。（余白分広がる）
私も簡単なアプリを作りました。使ってみて下さい。閲覧回数のボタンがあって5回以上になると緑の画面が出てきて元々の画像（ドーナツ各種）が見えなくなります。
（開発画面）
（プレビュー画面）閲覧回数が4回と5回の比較
（参考アプリ）クローンコピー可能
（ポイント）
～Adaloのレスポンシブルはややこしい～
visiblityの機能を使い、条件に応じて画像を表示したり非表示にしたりするとレスポンシブルの機能で画面スペースを取り合いします。2つの画像があって一方が非表示の場合は残りの一つの画像が我が物顔で幅いっぱいにスペースを取るようになります。（元々1個しか画像が無ければこんなことは起きません。ある一定のスペースに複数の画像を配置してvisiblityで表示したり消したりするときにこの現象は起こります。）
レスポンシブルの機能はAdaloの特徴です。変な空白を作らないための機能ですが、よくよく理解してやらないと画像の幅方向が妙に広がったりします。
私はAdaloの他にClickでもアプリを作りますが、Clickにはこのレスポンシブルの機能は無いです。そのためvisiblityを使うと変な空白ができてみっともないです。（その代わり使うのは簡単ですが）
うまく行かなかったら言って下さい。次の手を考えてみます。
1 Like
ここまでご丁寧に解説いただき、本当にありがとうございます。
本当に嬉しく思います。
ただ、上記のやり方で実装しても肥大化してしまいます。
上記のやり方との違う点で言うと、リスト上に配置しているか否かだと思うのですが、それが大きく影響しているのでしょうか。
お手数をおかけしますが、次の手をご教授いただけると幸いです。
0941様
こちらの実装なんとかできました！！
詳しいご解説をいただけたため、実装できたと思います、本当にありがとうございました！！
よかったですね！どんなことをしてうまく行ったのですか？よければ教えて下さい。
私が投稿しているnoteのブログネタにしたいと思います。
この質問は原因になりそうな部分がいろいろあって、ここをこうすればすぐ直るというものではないのでアプリをクローンコピーで共有してもらおうかと思っていたところでした。直ってよかったです。