webdevqa.jp.net

Android Honeycombアプリケーションの週間カレンダービューを作成するにはどうすればよいですか?

Googleカレンダーにある週ごとのカレンダーレイアウトを模倣する必要があるAndroid(v3.0)アプリケーションに取り組んでいます。

Google Calendar Weekly Layout

イベントは、Google Calendar APIを介した外部リクエストに基づいています(私はすでにこの部分を機能させています)。 APIを使用して、その週のイベントのリストを取得できます。各イベントには開始日時と終了日時があります。このデータを使用して、スケジュールされたイベントを上記のようなビューでアプリケーションのユーザーに表示したいと思います。

これが私がこれまでに持っているものです:

My Prototype Calendar View

XMLは以下のとおりです。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="800dp"
    Android:layout_height="match_parent"
    Android:orientation="vertical" >

    <TextView
        Android:id="@+id/textView1"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:text="Calendar Title"
        Android:textAppearance="?android:attr/textAppearanceLarge" />

    <RelativeLayout
        Android:id="@+id/relativeLayout1"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content" >

        <LinearLayout
            Android:id="@+id/linearLayout1"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_alignParentLeft="true"
            Android:layout_alignParentRight="true"
            Android:layout_alignParentTop="true" >

            <TextView
                Android:id="@+id/textView2"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_weight="1"
                Android:text="" />

            <TextView
                Android:id="@+id/textView3"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_weight="2"
                Android:gravity="center"
                Android:text="Sunday" />

            <TextView
                Android:id="@+id/textView4"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_weight="2"
                Android:gravity="center"
                Android:text="Monday" />

            <TextView
                Android:id="@+id/textView5"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_weight="2"
                Android:gravity="center"
                Android:text="Tuesday" />

            <TextView
                Android:id="@+id/textView6"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_weight="2"
                Android:gravity="center"
                Android:text="Wednesday" />

            <TextView
                Android:id="@+id/textView7"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_weight="2"
                Android:gravity="center"
                Android:text="Thursday" />

            <TextView
                Android:id="@+id/textView8"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_weight="2"
                Android:gravity="center"
                Android:text="Friday" />

            <TextView
                Android:id="@+id/textView9"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_weight="2"
                Android:gravity="center"
                Android:text="Saturday" />
        </LinearLayout>
    </RelativeLayout>

    <ScrollView
        Android:id="@+id/scrollView1"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:padding="0dp"
        Android:scrollbars="none" >"

        <RelativeLayout
            Android:id="@+id/relativeLayout242"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:padding="0dp" >


            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="0dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="40dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="80dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="120dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="160dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="200dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="240dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="280dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="320dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="360dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="400dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="440dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="480dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="520dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="560dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="600dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="640dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="680dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="720dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="760dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="800dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="840dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="880dp"/>
            <View Android:background="#aaa" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="920dp"/>

            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="20dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="60dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="100dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="140dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="180dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="220dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="260dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="300dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="340dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="380dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="420dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="460dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="500dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="540dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="580dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="620dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="660dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="700dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="740dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="780dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="820dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="860dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="900dp"/>
            <View Android:background="#777" Android:layout_width = "fill_parent" Android:layout_height="1dp" Android:layout_marginTop="940dp"/>

            <LinearLayout
                Android:id="@+id/linearLayout2"
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                Android:padding="0dp" >

                <RelativeLayout
                    Android:id="@+id/relativeLayout2"
                    Android:layout_width="0dp"
                    Android:layout_height="match_parent"
                    Android:layout_weight="1"
                    Android:padding="0dp" >

                    <View Android:background="#aaa" Android:layout_width = "1dp" Android:layout_height="fill_parent" Android:layout_alignParentRight="true"/>

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="0dp"
                        Android:gravity="center"
                        Android:text="12am" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="40dp"
                        Android:gravity="center"
                        Android:text="1am" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="80dp"
                        Android:gravity="center"
                        Android:text="2am" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="120dp"
                        Android:gravity="center"
                        Android:text="3am" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="160dp"
                        Android:gravity="center"
                        Android:text="4am" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="200dp"
                        Android:gravity="center"
                        Android:text="5am" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="240dp"
                        Android:gravity="center"
                        Android:text="6am" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="280dp"
                        Android:gravity="center"
                        Android:text="7am" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="320dp"
                        Android:gravity="center"
                        Android:text="8am" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="360dp"
                        Android:gravity="center"
                        Android:text="9am" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="400dp"
                        Android:gravity="center"
                        Android:text="10am" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="440dp"
                        Android:gravity="center"
                        Android:text="11am" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="480dp"
                        Android:gravity="center"
                        Android:text="12pm" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="520dp"
                        Android:gravity="center"
                        Android:text="1pm" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="560dp"
                        Android:gravity="center"
                        Android:text="2pm" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="600dp"
                        Android:gravity="center"
                        Android:text="3pm" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="640dp"
                        Android:gravity="center"
                        Android:text="4pm" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="680dp"
                        Android:gravity="center"
                        Android:text="5pm" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="720dp"
                        Android:gravity="center"
                        Android:text="6pm" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="760dp"
                        Android:gravity="center"
                        Android:text="7pm" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="800dp"
                        Android:gravity="center"
                        Android:text="8pm" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="840dp"
                        Android:gravity="center"
                        Android:text="9pm" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="880dp"
                        Android:gravity="center"
                        Android:text="10pm" />

                    <TextView
                        Android:id="@+id/textView10"
                        Android:layout_width="match_parent"
                        Android:layout_height="40dp"
                        Android:layout_marginTop="920dp"
                        Android:gravity="center|top"
                        Android:text="11pm" />
                </RelativeLayout>

                <RelativeLayout
                    Android:id="@+id/relativeLayout3"
                    Android:layout_width="0dp"
                    Android:layout_height="match_parent"
                    Android:layout_weight="14"
                    Android:padding="0dp" >

                    <LinearLayout
                        Android:id="@+id/linearLayout3"
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_alignParentLeft="true"
                        Android:layout_alignParentRight="true"
                        Android:layout_alignParentTop="true"
                        Android:padding="0dp" >

                        <RelativeLayout
                            Android:id="@+id/relativeLayout4"
                            Android:layout_width="0dp"
                            Android:layout_height="match_parent"
                            Android:layout_weight="1" >

                            <View Android:background="#00f" Android:layout_width = "fill_parent" Android:layout_height="180dp" Android:layout_marginTop="180dp"/>

                            <Button
                                Android:id="@+id/button1"
                                Android:layout_width="fill_parent"
                                Android:layout_height="180dp"
                                Android:layout_marginTop="180dp"
                                Android:text="Some Event" />

                        </RelativeLayout>

                        <RelativeLayout
                            Android:id="@+id/relativeLayout5"
                            Android:layout_width="0dp"
                            Android:layout_height="match_parent"
                            Android:layout_weight="1" >

                            <View Android:background="#00f" Android:layout_width = "fill_parent" Android:layout_height="180dp" Android:layout_marginTop="280dp"/>

                            <Button
                                Android:id="@+id/button1"
                                Android:layout_width="fill_parent"
                                Android:layout_height="180dp"
                                Android:layout_marginTop="280dp"
                                Android:text="Some Event" />

                        </RelativeLayout>

                        <RelativeLayout
                            Android:id="@+id/relativeLayout6"
                            Android:layout_width="0dp"
                            Android:layout_height="match_parent"
                            Android:layout_weight="1" >

                            <View Android:background="#00f" Android:layout_width = "fill_parent" Android:layout_height="60dp" Android:layout_marginTop="40dp"/>

                            <Button
                                Android:id="@+id/button1"
                                Android:layout_width="fill_parent"
                                Android:layout_height="60dp"
                                Android:layout_marginTop="40dp"
                                Android:text="Some Event" />

                        </RelativeLayout>

                        <RelativeLayout
                            Android:id="@+id/relativeLayout7"
                            Android:layout_width="0dp"
                            Android:layout_height="match_parent"
                            Android:layout_weight="1" >

                            <View Android:background="#00f" Android:layout_width = "fill_parent" Android:layout_height="90dp" Android:layout_marginTop="60dp"/>

                            <Button
                                Android:id="@+id/button1"
                                Android:layout_width="fill_parent"
                                Android:layout_height="90dp"
                                Android:layout_marginTop="60dp"
                                Android:text="Some Event" />

                            <View Android:background="#00f" Android:layout_width = "fill_parent" Android:layout_height="120dp" Android:layout_marginTop="340dp"/>

                            <Button
                                Android:id="@+id/button1"
                                Android:layout_width="fill_parent"
                                Android:layout_height="120dp"
                                Android:layout_marginTop="340dp"
                                Android:text="Some Event" />

                        </RelativeLayout>

                        <RelativeLayout
                            Android:id="@+id/relativeLayout8"
                            Android:layout_width="0dp"
                            Android:layout_height="match_parent"
                            Android:layout_weight="1" >

                            <View Android:background="#00f" Android:layout_width = "fill_parent" Android:layout_height="180dp" Android:layout_marginTop="380dp"/>

                            <Button
                                Android:id="@+id/button1"
                                Android:layout_width="fill_parent"
                                Android:layout_height="180dp"
                                Android:layout_marginTop="380dp"
                                Android:text="Some Event" />

                        </RelativeLayout>

                        <RelativeLayout
                            Android:id="@+id/relativeLayout9"
                            Android:layout_width="0dp"
                            Android:layout_height="match_parent"
                            Android:layout_weight="1" >

                            <View Android:background="#00f" Android:layout_width = "fill_parent" Android:layout_height="180dp" Android:layout_marginTop="480dp"/>

                            <Button
                                Android:id="@+id/button1"
                                Android:layout_width="fill_parent"
                                Android:layout_height="180dp"
                                Android:layout_marginTop="480dp"
                                Android:text="Some Event" />

                        </RelativeLayout>

                        <RelativeLayout
                            Android:id="@+id/relativeLayout10"
                            Android:layout_width="0dp"
                            Android:layout_height="match_parent"
                            Android:layout_weight="1" >

                            <View Android:background="#00f" Android:layout_width = "fill_parent" Android:layout_height="180dp" Android:layout_marginTop="340dp"/>

                            <Button
                                Android:id="@+id/button1"
                                Android:layout_width="fill_parent"
                                Android:layout_height="180dp"
                                Android:layout_marginTop="340dp"
                                Android:text="Some Event" />

                        </RelativeLayout>           

                    </LinearLayout>
                </RelativeLayout>
            </LinearLayout>
        </RelativeLayout>
    </ScrollView>

</LinearLayout>

私のアプローチは、40dpを1時間に等しくすることでした。したがって、1.5時間のイベントを追加したいときはいつでも、60dpボタンを作成して、時刻が始まる正確な場所に配置します(12am =上から0dp、1pm =上から40dp)。 、午後2時=上から80日など)。

私の質問は:

  1. これを行うためのより良い方法はありますか?
  2. XMLをスタンドアロンビューに変換して、任意のAndroidプロジェクトに追加できるようにするにはどうすればよいですか?(おそらく最終製品に関するブログ投稿を作成する予定です)

ありがとうございました!

15
BVB

私は元の投稿と同様のアプローチに従うことになりました。内部に線形レイアウトのスクロールビューを作成しました。次に、7つの相対レイアウトを線形レイアウトに追加しました。それぞれの相対的なレイアウトは1日です。これらのレイアウトの高さが1日の分数と同じであることを確認しました。これにより、1時間= 60分= 60 dpになり、イベントの高さの測定が容易になります。イベントについては、イベントの開始時刻と終了時刻、およびイベントのタイトルを表示できるカスタムビューを作成しました。イベントは、layout_marginTopプロパティを使用して相対レイアウトに追加されました。このプロパティの値は、1日の始まりからの分単位のイベントの開始時間に等しくなりました。これはうまく機能しているようでした。

これが最終的にどのように見えるかのプレビューです:

Calendar preview

XMLレイアウトは次のとおりです。 http://Pastebin.com/jT4wQxeb

コードが長すぎて答えに収まりません。

注意: calendar_zebraは、単純に60 * 24 = 1440dpの高さのレイアウトで、高さ1dpの水平方向のViewsで、60dpごとに灰色の背景が配置されます。それぞれが1時間のマーカーを表します。

18
BVB

1.これが私が Calendar のソースから理解したものです

これは、xmlのレイアウト全体に対してカスタマイズされたビュー(1日の議題のDayView)を作成します。

次に、onDraw()が呼び出されたときにアプリに表示されるような長方形とテキストを使用してキャンバスを描画します。

ビューは、イベントにOnClickListenerOnLongClickListenerを実装します。キャンバスをクリックすると、クリック位置が対応する日付と時刻のイベントに転送されます(したがって、オーバーライドonSizeChanged()が呼び出されると、イベント、マージン、終日イベントに関連する多くのサイズが計算されます) 、そのようなイベントが存在する場合はアクティビティを開始し、存在しない場合は新しいイベントを作成します。

2.クラス拡張ビュー(たとえばDayView)を作成する必要があります。次に、これをattrs.xmlに追加する必要があります。

<resources>
  <declare-styleable name="DayView">
  </declare-styleable>
</resources>

次に、パッケージ名を使用してレイアウトのxmlタグとして使用できます。ここみたいに:

<xxxxxxx.DayView
       Android:layout_height="wrap_content"
       Android:layout_width="match_parent"
       Android:id="@id/ui_schedule_dayview">

ここ そうするためのサンプルを見つけることができます

3
Yibo Long